Fix typecheck

Author: MichaelDeBoey

packages/app/src/app/pages/Sandbox/Editor/Workspace/items/Live/LiveInfo/Users/Editors/SideView.tsx

@@ -8,8 +8,12 @@ import RemoveIcon from 'react-icons/lib/md/remove';
 import { useSignals, useStore } from 'app/store';
 
 import { IconContainer } from '../elements';
+import { User } from '../types';
 
-export const SideView = observer(({ userId }) => {
+type Props = {
+  userId: User['id'];
+};
+export const SideView = observer<Props>(({ userId }) => {
   const {
     live: { onFollow, onRemoveEditorClicked },
   } = useSignals();

packages/app/src/app/pages/Sandbox/Editor/Workspace/items/Live/LiveInfo/Users/OtherUsers/SideView.tsx

@@ -8,8 +8,12 @@ import AddIcon from 'react-icons/lib/md/add';
 import { useSignals, useStore } from 'app/store';
 
 import { IconContainer } from '../elements';
+import { User } from '../types';
 
-export const SideView = observer(({ userId }) => {
+type Props = {
+  userId: User['id'];
+};
+export const SideView = observer<Props>(({ userId }) => {
   const {
     live: { onAddEditorClicked, onFollow },
   } = useSignals();

packages/app/src/app/pages/Sandbox/Editor/Workspace/items/Live/LiveInfo/Users/Owners/SideView.tsx

@@ -7,8 +7,12 @@ import UnFollowIcon from 'react-icons/lib/io/eye-disabled';
 import { useSignals, useStore } from 'app/store';
 
 import { IconContainer } from '../elements';
+import { User } from '../types';
 
-export const SideView = observer(({ userId }) => {
+type Props = {
+  userId: User['id'];
+};
+export const SideView = observer<Props>(({ userId }) => {
   const {
     live: { onFollow },
   } = useSignals();

packages/app/src/app/pages/Sandbox/Editor/Workspace/items/Live/LiveInfo/Users/User/User.tsx

@@ -1,11 +1,18 @@
 import { observer } from 'mobx-react-lite';
-import React from 'react';
+import React, { ReactNode } from 'react';
 
 import { useStore } from 'app/store';
 
+import { User as UserType } from '../types';
+
 import { UserContainer, ProfileImage, UserName, Status } from './elements';
 
-export const User = observer(({ sideView = null, type, user }) => {
+type Props = {
+  sideView?: ReactNode;
+  type: string;
+  user: UserType;
+};
+export const User = observer<Props>(({ sideView = null, type, user }) => {
   const {
     live: {
       liveUserId,

packages/app/src/app/pages/Sandbox/Editor/Workspace/items/Live/LiveInfo/Users/types.ts

@@ -0,0 +1,5 @@
+export type User = {
+  avatarUrl: string;
+  id: number;
+  username: string;
+};