WIP 5

apps/link/app/(main)/_components/Home.tsx

@@ -1,11 +1,9 @@
 "use client";
 
 import { FC } from "react";
-import { OpenSearchWrapper } from "leafcutter-common";
+import { OpenSearchWrapper } from "leafcutter-ui";
 
 export const Home: FC = () => (
-  <OpenSearchWrapper
-    url="/app/dashboards#/view/c39012d0-eb7a-11ed-8e00-17d7d50cd7b2?embed=true&tenant=global"
-    marginTop="0"
+  <OpenSearchWrapper url="/app/visualize#/edit/237b8f00-e6a0-11ee-94b3-d7b7409294e7?embed=true" marginTop="0"
   />
 );

apps/link/app/(main)/_components/Sidebar.tsx

@@ -35,6 +35,7 @@ import LinkLogo from "public/link-logo-small.png";
 import { useSession, signOut } from "next-auth/react";
 import { getTicketOverviewCountsQuery } from "app/_graphql/getTicketOverviewCountsQuery";
 import { SearchBox } from "./SearchBox";
+import { fonts } from "app/_styles/theme";
 
 const openWidth = 270;
 const closedWidth = 100;
@@ -49,8 +50,10 @@ const MenuItem = ({
   open = true,
   badge,
   target = "_self",
-}: any) => (
-  <Link href={href} target={target}>
+}: any) => {
+  const { roboto } = fonts;
+
+  return  (<Link href={href} target={target}>
     <ListItemButton
       sx={{
         p: 0,
@@ -123,7 +126,7 @@ const MenuItem = ({
               variant="body1"
               sx={{
                 fontSize: 16,
-                fontFamily: "Roboto",
+                fontFamily: roboto.style.fontFamily,
                 fontWeight: "bold",
                 border: 0,
                 textAlign: "left",
@@ -157,6 +160,7 @@ const MenuItem = ({
     </ListItemButton>
   </Link>
 );
+}
 
 interface SidebarProps {
   open: boolean;
@@ -166,6 +170,7 @@ interface SidebarProps {
 export const Sidebar: FC<SidebarProps> = ({ open, setOpen }) => {
   const pathname = usePathname();
   const { data: session } = useSession();
+  const { poppins } = fonts;
   const username = session?.user?.name || "User";
   // @ts-ignore
   const roles = session?.user?.roles || [];
@@ -272,7 +277,7 @@ export const Sidebar: FC<SidebarProps> = ({ open, setOpen }) => {
                   fontWeight: 700,
                   mt: 1,
                   ml: 0.5,
-                  fontFamily: "Poppins",
+                  fontFamily: poppins.style.fontFamily,
                 }}
               >
                 CDR Link

apps/link/app/(main)/leafcutter/_components/Home.tsx

@@ -1,30 +0,0 @@
-"use client";
-
-import { FC, /* useEffect,*/ useState } from "react";
-import { Home as HomeInternal } from "leafcutter-common";
-// import { fetchLeafcutter } from "@/app/_lib/utils";
-import ClientOnly from "@/app/(main)/_components/ClientOnly";
-
-export const Home: FC = () => {
-  const [visualizations, setVisualizations] = useState([]);
-  /*
-  useEffect(() => {
-    const getVisualizations = async () => {
-      const visualizations = await fetchLeafcutter(
-        "/api/visualizations/list",
-        {},
-      );
-      if (visualizations) {
-        setVisualizations(visualizations);
-      }
-    };
-
-    getVisualizations();
-  }, []);
-*/
-  return (
-    <ClientOnly>
-      <HomeInternal visualizations={visualizations} />
-    </ClientOnly>
-  );
-};

apps/link/app/(main)/leafcutter/_components/LeafcutterWrapper.tsx

@@ -1,6 +0,0 @@
-import { FC, PropsWithChildren } from "react";
-import { Box } from "@mui/material";
-
-export const LeafcutterWrapper: FC<PropsWithChildren> = ({ children }) => {
-  return <Box sx={{ p: 3 }}>{children}</Box>;
-};

apps/link/app/(main)/leafcutter/about/page.tsx

@@ -1,10 +1,5 @@
-import { Box } from "@mui/material";
-import { About } from "leafcutter-common";
+import { About } from "leafcutter-ui";
 
 export default function Page() {
-  return (
-    <Box sx={{ p: 3 }}>
-      <About />
-    </Box>
-  );
+  return <About />;
 }

apps/link/app/(main)/leafcutter/create/page.tsx

@@ -1,13 +1,8 @@
-// import { getTemplates } from "app/_lib/opensearch";
-import { Create } from "leafcutter-common";
-import { Box } from "@mui/material";
+import { getTemplates } from "opensearch-common";
+import { Create } from "leafcutter-ui";
 
 export default async function Page() {
-  const templates = []; // await getTemplates(100);
+  const templates = await getTemplates(100);
 
-  return (
-    <Box sx={{ p: 3 }}>
-      <Create templates={templates} />
-    </Box>
-  );
+  return <Create templates={templates} />;
 }

apps/link/app/(main)/leafcutter/faq/page.tsx

@@ -1,10 +1,5 @@
-import { Box } from "@mui/material";
-import { FAQ } from "leafcutter-common";
+import { FAQ } from "leafcutter-ui";
 
 export default function Page() {
-  return (
-    <Box sx={{ p: 3 }}>
-      <FAQ />
-    </Box>
-  );
+  return <FAQ />;
 }

apps/link/app/(main)/leafcutter/layout.tsx

@@ -0,0 +1,10 @@
+import { ReactNode } from "react";
+import { LeafcutterWrapper } from "leafcutter-ui";
+
+type LayoutProps = {
+  children: ReactNode;
+};
+
+export default function Layout({ children }: LayoutProps) {
+  return <LeafcutterWrapper>{children}</LeafcutterWrapper>;
+}

apps/link/app/(main)/leafcutter/login/page.tsx

@@ -1,10 +0,0 @@
-import { Box } from "@mui/material";
-import { FAQ } from "leafcutter-common";
-
-export default function Page() {
-  return (
-    <Box sx={{ p: 3 }}>
-      <FAQ />
-    </Box>
-  );
-}

apps/link/app/(main)/leafcutter/page.tsx

@@ -1,5 +1,4 @@
-import { Home } from "./_components/Home";
-import { LeafcutterWrapper } from "./_components/LeafcutterWrapper";
+import { Home, LeafcutterWrapper } from "leafcutter-ui";
 
 export default async function Page() {
   return (

apps/link/app/(main)/leafcutter/trends/page.tsx

@@ -1,12 +1,7 @@
-import { Box } from "@mui/material";
-import { Trends } from "leafcutter-common";
-
-export default function Page() {
-  return (
-    <Box sx={{ p: 3 }}>
-      <Trends visualizations={[]} />
-    </Box>
-  );
-}
+import { Trends } from "leafcutter-ui";
 
 export const dynamic = "force-dynamic";
+
+export default function Page() {
+  return <Trends visualizations={[]} />;
+}

apps/link/app/(main)/page.tsx

@@ -1,10 +1,23 @@
 import { Metadata } from "next";
-import { Home } from "./_components/Home";
+import { getServerSession } from "app/_lib/authentication";
+import { Home } from "leafcutter-ui";
+import { getUserVisualizations } from "opensearch-common";
+import { LeafcutterWrapper } from "leafcutter-ui";
 
 export const metadata: Metadata = {
   title: "Link",
 };
 
-export default function Page() {
-  return <Home />;
+export default async function Page() {
+  const session = await getServerSession();
+  const {
+    user: { email },
+  }: any = session;
+  const visualizations = await getUserVisualizations(email ?? "none", 20);
+
+  return (
+    <LeafcutterWrapper>
+      <Home visualizations={visualizations} showWelcome={false} />
+    </LeafcutterWrapper>
+  );
 }