fix: frontend queries to use new schema (#1338)

fix: frontend queries to use new schema on the API v1 * Removes use of slug => source/namespace/name * Update GraphQL queries to follow new names * Update the page routing to use enums directly
opensource-observer · May 22, 2024 · ac4c9d7 · ac4c9d7
1 parent 0b3d52d
commit ac4c9d7
Show file tree

Hide file tree

Showing 7 changed files with 177 additions and 157 deletions.
diff --git a/.github/workflows/ci-default.yml b/.github/workflows/ci-default.yml
@@ -22,6 +22,8 @@ env:
   DOCS_ALGOLIA_API_KEY: "test"
   DOCS_ALGOLIA_INDEX: "test"
   DOCS_SEGMENT_WRITE_KEY: "test"
+  # Hasura variables
+  DBT_TARGET: "production"
   # Google variables
   GOOGLE_PROJECT_ID: "opensource-observer"
   GOOGLE_TEST_DUMMY_CREDENTIALS_JSON: ${{ vars.GOOGLE_TEST_DUMMY_CREDENTIALS_JSON }}

diff --git a/...act/[namespace]/[type]/[...name]/page.tsx → .../app/artifact/[source]/[...name]/page.tsx b/...act/[namespace]/[type]/[...name]/page.tsx → .../app/artifact/[source]/[...name]/page.tsx
@@ -1,33 +1,29 @@
 import { notFound } from "next/navigation";
 import { cache } from "react";
 import { PlasmicComponent } from "@plasmicapp/loader-nextjs";
-import { PLASMIC } from "../../../../../plasmic-init";
-import { PlasmicClientRootProvider } from "../../../../../plasmic-init-client";
-import { cachedGetArtifactByName } from "../../../../../lib/graphql/cached-queries";
-import { logger } from "../../../../../lib/logger";
-import {
-  catchallPathToString,
-  pathToNamespaceEnum,
-  pathToTypeEnum,
-} from "../../../../../lib/paths";
+import { PLASMIC } from "../../../../plasmic-init";
+import { PlasmicClientRootProvider } from "../../../../plasmic-init-client";
+import { cachedGetArtifactByName } from "../../../../lib/graphql/cached-queries";
+import { logger } from "../../../../lib/logger";
 
 const PLASMIC_COMPONENT = "ArtifactPage";
 //export const dynamic = STATIC_EXPORT ? "force-static" : "force-dynamic";
 export const dynamic = "force-static";
 export const dynamicParams = true;
 export const revalidate = false; // 3600 = 1 hour
+/**
 // TODO: This cannot be empty due to this bug
 // https://github.com/vercel/next.js/issues/61213
-const STATIC_EXPORT_PARAMS = [
+const STATIC_EXPORT_PARAMS: ArtifactPagePath[] = [
   {
-    namespace: "github",
-    type: "repo",
+    source: "github",
     name: ["opensource-observer", "oso"],
   },
 ];
 export async function generateStaticParams() {
   return STATIC_EXPORT_PARAMS;
 }
+ */
 
 const cachedFetchComponent = cache(async (componentName: string) => {
   try {
@@ -44,40 +40,42 @@ const cachedFetchComponent = cache(async (componentName: string) => {
  * on the first HTTP request, which should be faster than fetching it client-side
  */
 
+type ArtifactPagePath = {
+  source: string;
+  name: string[];
+};
+
 type ArtifactPageProps = {
-  params: {
-    namespace: string;
-    type: string;
-    name: string[];
-  };
+  params: ArtifactPagePath;
 };
 
 export default async function ArtifactPage(props: ArtifactPageProps) {
   const { params } = props;
-  const namespace = pathToNamespaceEnum(params.namespace);
-  const type = pathToTypeEnum(params.type);
-  const name = catchallPathToString(params.name);
+
   if (
-    !params.namespace ||
-    !params.type ||
+    !params.source ||
     !params.name ||
     !Array.isArray(params.name) ||
-    params.name.length < 1 ||
-    !namespace ||
-    !type
+    params.name.length < 1
   ) {
     logger.warn("Invalid artifact page path", params);
     notFound();
   }
 
+  const source = params.source.toUpperCase();
+  const [namespace, name] =
+    params.name.length > 1 ? params.name : [undefined, params.name[0]];
+
   // Get artifact metadata from the database
   const { artifacts: artifactArray } = await cachedGetArtifactByName({
+    artifact_source: source,
     artifact_namespace: namespace,
-    artifact_type: type,
     artifact_name: name,
   });
   if (!Array.isArray(artifactArray) || artifactArray.length < 1) {
-    logger.warn(`Cannot find artifact (namespace=${namespace}, name=${name})`);
+    logger.warn(
+      `Cannot find artifact (source=${source}, namespace=${namespace}, name=${name})`,
+    );
     notFound();
   }
   const artifact = artifactArray[0];

diff --git a/apps/frontend/app/project/[...slug]/page.tsx → apps/frontend/app/project/[...name]/page.tsx b/apps/frontend/app/project/[...slug]/page.tsx → apps/frontend/app/project/[...name]/page.tsx
@@ -4,7 +4,7 @@ import { PlasmicComponent } from "@plasmicapp/loader-nextjs";
 import { PLASMIC } from "../../../plasmic-init";
 import { PlasmicClientRootProvider } from "../../../plasmic-init-client";
 import {
-  cachedGetProjectsBySlugs,
+  cachedGetProjectByName,
   cachedGetCodeMetricsByProjectIds,
   cachedGetOnchainMetricsByProjectIds,
   cachedGetAllEventTypes,
@@ -22,7 +22,7 @@ export const revalidate = false; // 3600 = 1 hour
 const STATIC_EXPORT_SLUGS: string[] = ["opensource-observer"];
 export async function generateStaticParams() {
   return STATIC_EXPORT_SLUGS.map((s) => ({
-    slug: [s],
+    name: [s],
   }));
 }
 
@@ -41,26 +41,28 @@ const cachedFetchComponent = cache(async (componentName: string) => {
  * on the first HTTP request, which should be faster than fetching it client-side
  */
 
+type ProjectPagePath = {
+  name: string[];
+};
+
 type ProjectPageProps = {
-  params: {
-    slug: string[];
-  };
+  params: ProjectPagePath;
 };
 
 export default async function ProjectPage(props: ProjectPageProps) {
   const { params } = props;
-  const slugs = [catchallPathToString(params.slug)];
-  if (!params.slug || !Array.isArray(params.slug) || params.slug.length < 1) {
+  if (!params.name || !Array.isArray(params.name) || params.name.length < 1) {
     logger.warn("Invalid project page path", params);
     notFound();
   }
 
   // Get project metadata from the database
-  const { projects: projectArray } = await cachedGetProjectsBySlugs({
-    project_slugs: slugs,
+  const name = catchallPathToString(params.name);
+  const { projects: projectArray } = await cachedGetProjectByName({
+    project_name: name,
   });
   if (!Array.isArray(projectArray) || projectArray.length < 1) {
-    logger.warn(`Cannot find project (slugs=${slugs})`);
+    logger.warn(`Cannot find project (name=${name})`);
     notFound();
   }
   const project = projectArray[0];

diff --git a/apps/frontend/components/dataprovider/event-data-provider.tsx b/apps/frontend/components/dataprovider/event-data-provider.tsx
@@ -13,7 +13,7 @@ import {
   GET_EVENTS_DAILY_TO_PROJECT,
   GET_EVENTS_WEEKLY_TO_PROJECT,
   GET_EVENTS_MONTHLY_TO_PROJECT,
-  GET_USERS_MONTHLY_TO_PROJECT,
+  //GET_USERS_MONTHLY_TO_PROJECT,
   GET_EVENTS_MONTHLY_TO_COLLECTION,
   GET_EVENTS_WEEKLY_TO_COLLECTION,
   GET_EVENTS_DAILY_TO_COLLECTION,
@@ -380,12 +380,15 @@ function ArtifactEventDataProvider(props: EventDataProviderProps) {
     ),
     amount: ensure<number>(x.amount, "Data missing 'number'"),
   }));
-  const entityData = artifactData?.artifacts.map((x) => ({
+  const entityData = artifactData?.artifacts_v1.map((x) => ({
     id: ensure<string>(x.artifact_id, "artifact missing 'artifact_id'"),
-    name: ensure<string>(
-      x.artifact_latest_name,
-      "artifact missing 'artifact_latest_name'",
-    ),
+    name:
+      ensure<string>(
+        x.artifact_namespace,
+        "artifact missing 'artifact_namespace'",
+      ) +
+      "/" +
+      ensure<string>(x.artifact_name, "artifact missing 'artifact_name'"),
   }));
   const formattedData = formatData(props, normalizedEventData, entityData, {
     gapFill: bucketWidth === "day",
@@ -448,7 +451,7 @@ function ProjectEventDataProvider(props: EventDataProviderProps) {
     ),
     amount: ensure<number>(x.amount, "Data missing 'number'"),
   }));
-  const entityData = projectData?.projects.map((x) => ({
+  const entityData = projectData?.projects_v1.map((x) => ({
     id: ensure<string>(x.project_id, "project missing 'project_id'"),
     name: ensure<string>(x.project_name, "project missing 'project_name'"),
   }));
@@ -513,7 +516,7 @@ function CollectionEventDataProvider(props: EventDataProviderProps) {
     ),
     amount: ensure<number>(x.amount, "Data missing 'number'"),
   }));
-  const entityData = collectionData?.collections.map((x) => ({
+  const entityData = collectionData?.collections_v1.map((x) => ({
     id: ensure<string>(x.collection_id, "collection missing 'collection_id'"),
     name: ensure<string>(
       x.collection_name,
@@ -539,8 +542,9 @@ function CollectionEventDataProvider(props: EventDataProviderProps) {
  * @param props
  * @returns
  */
-function ProjectUserDataProvider(props: EventDataProviderProps) {
+function ProjectUserDataProvider(_props: EventDataProviderProps) {
   useEnsureAuth();
+  /**
   const {
     data: rawEventData,
     error: eventError,
@@ -585,6 +589,8 @@ function ProjectUserDataProvider(props: EventDataProviderProps) {
       error={eventError ?? projectError}
     />
   );
+  */
+  return <p>Unimplemented</p>;
 }
 
 export {

diff --git a/apps/frontend/lib/graphql/cached-queries.ts b/apps/frontend/lib/graphql/cached-queries.ts
@@ -3,9 +3,10 @@ import { getApolloClient } from "../clients/apollo";
 import { QueryOptions } from "@apollo/client";
 import {
   GET_ARTIFACTS_BY_IDS,
-  GET_ARTIFACT_BY_NAME,
+  GET_ARTIFACT_BY_SOURCE_NAMESPACE_NAME,
+  GET_ARTIFACT_BY_SOURCE_NAME,
   GET_ARTIFACT_IDS_BY_PROJECT_IDS,
-  GET_PROJECTS_BY_SLUGS,
+  GET_PROJECT_BY_NAME,
   GET_COLLECTIONS_BY_IDS,
   GET_COLLECTION_IDS_BY_PROJECT_IDS,
   GET_CODE_METRICS_BY_PROJECT,
@@ -33,10 +34,10 @@ const cachedGetAllEventTypes = cache(async () =>
   }),
 );
 
-const cachedGetProjectsBySlugs = cache(
-  async (variables: { project_slugs: string[] }) =>
+const cachedGetProjectByName = cache(
+  async (variables: { project_name: string }) =>
     queryWrapper({
-      query: GET_PROJECTS_BY_SLUGS,
+      query: GET_PROJECT_BY_NAME,
       variables,
     }),
 );
@@ -51,14 +52,19 @@ const cachedGetArtifactsByIds = cache(
 
 const cachedGetArtifactByName = cache(
   async (variables: {
-    artifact_namespace: string;
-    artifact_type: string;
+    artifact_source: string;
+    artifact_namespace?: string;
     artifact_name: string;
   }) =>
-    queryWrapper({
-      query: GET_ARTIFACT_BY_NAME,
-      variables,
-    }),
+    variables.artifact_namespace
+      ? queryWrapper({
+          query: GET_ARTIFACT_BY_SOURCE_NAMESPACE_NAME,
+          variables,
+        })
+      : queryWrapper({
+          query: GET_ARTIFACT_BY_SOURCE_NAME,
+          variables,
+        }),
 );
 
 const cachedGetArtifactIdsByProjectIds = cache(
@@ -105,7 +111,7 @@ export {
   cachedGetArtifactsByIds,
   cachedGetArtifactByName,
   cachedGetArtifactIdsByProjectIds,
-  cachedGetProjectsBySlugs,
+  cachedGetProjectByName,
   cachedGetCollectionsByIds,
   cachedGetCollectionIdsByProjectIds,
   cachedGetCodeMetricsByProjectIds,