GraphQL and MUI license updates

apps/link/app/(main)/overview/[overview]/_components/TicketList.tsx

@@ -4,6 +4,7 @@ import { FC } from "react";
 import { Grid, Box } from "@mui/material";
 import { GridColDef } from "@mui/x-data-grid-pro";
 import { StyledDataGrid } from "../../../_components/StyledDataGrid";
+import { Button } from "app/_components/Button";
 import { typography } from "app/_styles/theme";
 import { useRouter } from "next/navigation";
 
@@ -46,18 +47,29 @@ export const TicketList: FC<TicketListProps> = ({ title, tickets }) => {
   return (
     <Box sx={{ height: "100vh", backgroundColor: "#ddd", p: 3 }}>
       <Grid container direction="column">
-        <Grid item>
-          <Box
-            sx={{
-              backgroundColor: "#ddd",
-              px: "8px",
-              pb: "16px",
-              ...typography.h4,
-              fontSize: 24,
-            }}
-          >
-            {title}
-          </Box>
+        <Grid
+          item
+          container
+          direction="row"
+          justifyContent="space-between"
+          alignItems="center"
+        >
+          <Grid item>
+            <Box
+              sx={{
+                backgroundColor: "#ddd",
+                px: "8px",
+                pb: "16px",
+                ...typography.h4,
+                fontSize: 24,
+              }}
+            >
+              {title}
+            </Box>
+          </Grid>
+          <Grid item>
+            <Button href="/tickets/create" text="Create" color="#1982FC" />
+          </Grid>
         </Grid>
         <Grid item>
           <StyledDataGrid

apps/link/app/(main)/overview/[overview]/_components/ZammadOverview.tsx

@@ -25,7 +25,7 @@ export const ZammadOverview: FC<ZammadOverviewProps> = ({ name, id }) => {
 
   return (
     <>
-      {shouldRender && <TicketList title="Assigned" tickets={tickets} />}
+      {shouldRender && <TicketList title={name} tickets={tickets} />}
       {ticketError && <div>{ticketError.toString()}</div>}
     </>
   );

apps/link/app/(main)/overview/[overview]/page.tsx

@@ -1,6 +1,10 @@
 import { Metadata } from "next";
 import { ZammadOverview } from "./_components/ZammadOverview";
 
+const getSection = (overview: string) => {
+  return overview.charAt(0).toUpperCase() + overview.slice(1);
+};
+
 type MetadataProps = {
   params: {
     overview: string;
@@ -10,7 +14,7 @@ type MetadataProps = {
 export async function generateMetadata({
   params: { overview },
 }: MetadataProps): Promise<Metadata> {
-  const section = overview.charAt(0).toUpperCase() + overview.slice(1);
+  const section = getSection(overview);
 
   return {
     title: `Link - ${section} Tickets`,
@@ -31,6 +35,7 @@ type PageProps = {
 };
 
 export default function Page({ params: { overview } }: PageProps) {
-  console.log({ overview });
-  return <ZammadOverview name={overview} id={overviews[overview]} />;
+  const section = getSection(overview);
+
+  return <ZammadOverview name={section} id={overviews[overview]} />;
 }