adding a bunch of linting and starting project over with nothing

packages/legacy/components/User/avatarWithBadge.tsx

@@ -0,0 +1,15 @@
+import { Avatar, Badge } from "antd";
+
+import { UserOutlined } from "@ant-design/icons";
+
+const AvatarWithBadge = ({ src }: { src: string }) => (
+  <>
+    <span>
+      <Badge dot>
+        <Avatar shape="square" src={src} />
+      </Badge>
+    </span>
+  </>
+);
+
+export default AvatarWithBadge;

packages/legacy/components/User/basicUserDetailsRow.tsx

@@ -0,0 +1,37 @@
+import { Avatar, Tooltip } from "antd";
+
+import { FaAngleRight } from "react-icons/fa";
+import { ReactElement } from "react";
+import { User } from "@nirvana/core/models/user.model";
+
+export default function BasicUserRow({
+  user,
+  rightJsx,
+}: {
+  user: User;
+  rightJsx?: ReactElement;
+}) {
+  return (
+    <span
+      key={user._id.toString() + new Date().toDateString()}
+      className="border-t border-t-gray-200 py-3 px-2 flex flex-row justify-start 
+    items-center w-full hover:bg-gray-200 cursor-pointer group"
+    >
+      <Avatar
+        key={`searchUsers-${user._id.toString()}`}
+        shape="square"
+        src={user.picture}
+        size="default"
+        className="shadow-lg mr-2"
+      />
+
+      <span className="flex flex-col items-start">
+        <span className="text-gray-500 text-lg font-semibold">{user.name}</span>
+
+        <span className="text-gray-300">{user.email}</span>
+      </span>
+
+      <div className="ml-auto">{rightJsx}</div>
+    </span>
+  );
+}

packages/legacy/components/User/userAvatarWithStatus.tsx

@@ -0,0 +1,36 @@
+import { User, UserStatus } from "@nirvana/core/models";
+
+export default function UserAvatarWithStatus(props: { user: User }) {
+  return (
+    <div className="relative">
+      <img
+        src={props.user.picture}
+        className="rounded-lg h-8 hover:bg-zinc-200 hover:cursor-pointer hover:scale-110"
+        alt=""
+      />
+
+      <UserStatusBubble status={props.user.status} />
+    </div>
+  );
+}
+
+export function UserStatusBubble(props: { status: UserStatus }) {
+  switch (props.status) {
+    case UserStatus.ONLINE:
+      return (
+        <span className="absolute -bottom-1 -right-1 rounded-full bg-emerald-600 h-3 w-3"></span>
+      );
+    case UserStatus.OFFLINE:
+      return (
+        <span className="absolute -bottom-1 -right-1 rounded-full bg-zinc-400 h-3 w-3"></span>
+      );
+    case UserStatus.FLOW_STATE:
+      return (
+        <span className="absolute -bottom-1 -right-1 rounded-full bg-pink-400 h-3 w-3"></span>
+      );
+    default:
+      return (
+        <span className="absolute -bottom-1 -right-1 rounded-full bg-pink-400 h-3 w-3"></span>
+      );
+  }
+}

packages/legacy/components/User/userStatusText.tsx

@@ -0,0 +1,16 @@
+import { UserStatus } from "@nirvana/core/models";
+
+export default function UserStatusText(props: { status: UserStatus }) {
+  switch (props.status) {
+    case UserStatus.ONLINE:
+      return <span className="text-emerald-600 text-sm lowercase">ONLINE</span>;
+    case UserStatus.OFFLINE:
+      return <></>;
+    case UserStatus.FLOW_STATE:
+      return (
+        <span className="text-pink-400 text-sm lowercase">FLOW STATE</span>
+      );
+    default:
+      return <></>;
+  }
+}