New Directory Setup (#2065)

* chore: moved app & space from apps to root

* chore: modified workspace configuration

* chore: modified dockerfiles for space and web

* chore: modified icons for space

* feat: updated files for new svg icons supported by next-images

* chore: added /spaces base path for next

* chore: added compose config for space

* chore: updated husky configuration

* chore: updated workflows for new configuration

* chore: changed app name to web

* fix: resolved build errors with web

* chore: reset file tracing root for both projects

* chore: added nginx config for deploy

* fix: eslint and tsconfig settings for space app

* husky setup fixes based on new dir

* eslint fixes

* prettier formatting

---------

Co-authored-by: Henit Chobisa <chobisa.henit@gmail.com>

web/components/ui/empty-space.tsx

@@ -0,0 +1,82 @@
+// next
+import Link from "next/link";
+// react
+import React from "react";
+// icons
+import { ChevronRightIcon } from "@heroicons/react/24/outline";
+
+type EmptySpaceProps = {
+  title: string;
+  description: string;
+  children: any;
+  Icon?: any;
+  link?: { text: string; href: string };
+};
+
+const EmptySpace: React.FC<EmptySpaceProps> = ({ title, description, children, Icon, link }) => (
+  <>
+    <div className="max-w-lg">
+      {Icon ? (
+        <div className="mb-4">
+          <Icon className="h-14 w-14 text-custom-text-200" />
+        </div>
+      ) : null}
+
+      <h2 className="text-lg font-medium text-custom-text-100">{title}</h2>
+      <div className="mt-1 text-sm text-custom-text-200">{description}</div>
+      <ul
+        role="list"
+        className="mt-6 divide-y divide-custom-border-200 border-t border-b border-custom-border-200"
+      >
+        {children}
+      </ul>
+      {link ? (
+        <div className="mt-6 flex">
+          <Link href={link.href}>
+            <a className="text-sm font-medium text-custom-primary hover:text-custom-primary">
+              {link.text}
+              <span aria-hidden="true"> &rarr;</span>
+            </a>
+          </Link>
+        </div>
+      ) : null}
+    </div>
+  </>
+);
+
+type EmptySpaceItemProps = {
+  title: string;
+  description?: React.ReactNode | string;
+  Icon: any;
+  action: () => void;
+};
+
+const EmptySpaceItem: React.FC<EmptySpaceItemProps> = ({ title, description, Icon, action }) => (
+  <>
+    <li className="cursor-pointer" onClick={action}>
+      <div
+        className={`group relative flex ${
+          description ? "items-start" : "items-center"
+        } space-x-3 py-4`}
+      >
+        <div className="flex-shrink-0">
+          <span className="inline-flex h-10 w-10 items-center justify-center rounded-lg bg-custom-primary">
+            <Icon className="h-6 w-6 text-white" aria-hidden="true" />
+          </span>
+        </div>
+        <div className="min-w-0 flex-1 text-custom-text-200">
+          <div className="text-sm font-medium group-hover:text-custom-text-100">{title}</div>
+          {description ? <div className="text-sm">{description}</div> : null}
+        </div>
+        <div className="flex-shrink-0 self-center">
+          <ChevronRightIcon
+            className="h-5 w-5 text-custom-text-200 group-hover:text-custom-text-100"
+            aria-hidden="true"
+          />
+        </div>
+      </div>
+    </li>
+  </>
+);
+
+export { EmptySpace, EmptySpaceItem };