More app directory refactoring

apps/leafcutter/app/visualizations/[...visualizationID]/page.tsx

@@ -1,26 +1,8 @@
 /* eslint-disable no-underscore-dangle */
-import { NextPage, GetServerSideProps, GetServerSidePropsContext } from "next";
 import { Client } from "@opensearch-project/opensearch";
 import { VisualizationDetail } from "@/app/_components/VisualizationDetail";
-import { getEmbedded } from "@/app/_lib/utils";
-
-type VisualizationProps = {
-  visualization: any;
-  embedded: boolean;
-};
-
-const Visualization: NextPage<VisualizationProps> = ({
-  visualization,
-  embedded,
-}) => <VisualizationDetail {...visualization} />;
-
-export default Visualization;
-
-export const getServerSideProps: GetServerSideProps = async (
-  context: GetServerSidePropsContext
-) => {
-  const { visualizationID } = context.query;
 
+const getVisualization = async (visualizationID: string) => {
   const node = `https://${process.env.OPENSEARCH_USERNAME}:${process.env.OPENSEARCH_PASSWORD}@${process.env.OPENSEARCH_URL}`;
   const client = new Client({
     node,
@@ -36,7 +18,6 @@ export const getServerSideProps: GetServerSideProps = async (
   const response = rawResponse.body;
 
   const hits = response.hits.hits.filter(
-    // @ts-expect-error
     (hit: any) => hit._id.split(":")[1] === visualizationID[0]
   );
   const hit = hits[0];
@@ -49,5 +30,19 @@ export const getServerSideProps: GetServerSideProps = async (
     }?embed=true`,
   };
 
-  return { props: { visualization, embedded: getEmbedded(context) } };
-};
+  return visualization;
+}
+
+type PageProps = {
+  params: {
+    visualizationID: string;
+  };
+  }
+
+export default async function Page({ params: { visualizationID } }: PageProps) {
+  const visualization = await getVisualization(visualizationID);
+
+  return  <VisualizationDetail {...visualization} editing={false}/>;
+}
+
+