feature/bugfix: fixed redirects of shopify onboarding flow from user install.

Author: cdxker

clients/trieve-shopify-extension/app/auth.ts

@@ -3,12 +3,73 @@ import { authenticate } from "app/shopify.server";
 import { StrongTrieveKey, TrieveKey } from "./types";
 import { TrieveSDK, CreateApiUserResponse } from "trieve-ts-sdk";
 import { getTrieveBaseUrlEnv } from "./env.server";
+import { buildAdminApiFetcherForServer } from "./loaders/serverLoader";
+import { AdminApiCaller } from "./loaders";
+import { AppInstallData } from "./routes/app.setup";
 
 export const validateTrieveAuth = async <S extends boolean = true>(
   request: LoaderFunctionArgs["request"],
   strict: S = true as S,
 ): Promise<S extends true ? StrongTrieveKey : TrieveKey> => {
-  let { admin, session } = await authenticate.admin(request);
+  const setAppMetafields = async (
+    adminApi: AdminApiCaller,
+    trieveKey: TrieveKey,
+  ) => {
+    const response = await adminApi<AppInstallData>(`
+      #graphql
+      query {
+        currentAppInstallation {
+          id
+        }
+      }
+      `);
+
+    if (response.error) {
+      throw response.error;
+    }
+
+    const appId = response.data;
+
+    await adminApi(
+      `#graphql
+    mutation CreateAppDataMetafield($metafieldsSetInput: [MetafieldsSetInput!]!) {
+        metafieldsSet(metafields: $metafieldsSetInput) {
+          metafields {
+            id
+            namespace
+            key
+          }
+          userErrors {
+            field
+            message
+          }
+        }
+      }
+    `,
+      {
+        variables: {
+          metafieldsSetInput: [
+            {
+              namespace: "trieve",
+              key: "dataset_id",
+              value: trieveKey.currentDatasetId,
+              type: "single_line_text_field",
+              ownerId: appId.currentAppInstallation.id,
+            },
+            {
+              namespace: "trieve",
+              key: "api_key",
+              value: trieveKey.key,
+              type: "single_line_text_field",
+              ownerId: appId.currentAppInstallation.id,
+            },
+          ],
+        },
+      },
+    );
+  };
+
+  const { admin, session } = await authenticate.admin(request);
 
   let key = await prisma.apiKey.findFirst({
     where: {
@@ -61,6 +122,70 @@ export const validateTrieveAuth = async <S extends boolean = true>(
         createdAt: new Date(),
       }
     });
+
+    const trieve = new TrieveSDK({
+      baseUrl: getTrieveBaseUrlEnv(),
+      apiKey: key.key,
+      datasetId: key.currentDatasetId ? key.currentDatasetId : undefined,
+      organizationId: key.organizationId,
+      omitCredentials: true,
+    });
+    let datasetId = trieve.datasetId;
+
+    let shopDataset = await trieve
+      .getDatasetByTrackingId(session.shop)
+      .catch(() => {
+        return null;
+      });
+
+    const fetcher = buildAdminApiFetcherForServer(
+      session.shop,
+      session.accessToken!,
+    );
+
+    if ((!datasetId || !shopDataset) && trieve.organizationId) {
+      if (!shopDataset) {
+        shopDataset = await trieve.createDataset({
+          dataset_name: session.shop,
+          tracking_id: session.shop,
+          server_configuration: {
+            SYSTEM_PROMPT:
+              "[[personality]]\nYou are a friendly, helpful, and knowledgeable ecommerce sales associate. Your communication style is warm, patient, and enthusiastic without being pushy. You're approachable and conversational while maintaining professionalism. You balance being personable with being efficient, understanding that customers value both connection and their time. You're solution-oriented and genuinely interested in helping customers find the right products for their needs.\n\n[[goal]]\nYour primary goal is to help customers find products that genuinely meet their needs while providing an exceptional shopping experience. You aim to:\n1. Understand customer requirements through thoughtful questions\n2. Provide relevant product recommendations based on customer preferences\n3. Offer detailed, accurate information about products\n4. Address customer concerns and objections respectfully\n5. Guide customers through the purchasing process\n6. Encourage sales without being pushy or manipulative\n7. Create a positive impression that builds long-term customer loyalty\n\n[[response structure]]\n1. Begin with a warm greeting and acknowledgment of the customer's query or concern\n2. Ask clarifying questions if needed to better understand their requirements\n3. Provide concise, relevant information that directly addresses their needs\n4. Include specific product recommendations when appropriate, with brief explanations of why they might be suitable\n5. Address any potential concerns proactively\n6. Close with a helpful next step or question that moves the conversation forward\n7. Keep responses conversational yet efficient, balancing thoroughness with respect for the customer's time.\n",
+            RAG_PROMPT:
+              "You may use the retrieved context to help you respond. When discussing products, prioritize information from the provided product data while using your general knowledge to create helpful, natural responses. If a customer asks about products or specifications not mentioned in the context, acknowledge the limitation and offer to check for more information rather than inventing details.",
+          },
+        });
+
+        console.log("created dataset for shop");
+
+        key = await prisma.apiKey.update({
+          data: {
+            currentDatasetId: shopDataset.id,
+          },
+          where: {
+            shop: `${session.shop}`,
+          },
+        });
+      } else {
+        key = await prisma.apiKey.update({
+          data: {
+            currentDatasetId: shopDataset.id,
+          },
+          where: {
+            shop: `${session.shop}`,
+          },
+        });
+      }
+
+      if (key.currentDatasetId && key.key && session) {
+        setAppMetafields(fetcher, {
+          id: key.id,
+          key: key.key,
+          organizationId: key.organizationId,
+          currentDatasetId: key.currentDatasetId,
+        } as TrieveKey);
+      }
+    }
   }
 
   return {

clients/trieve-shopify-extension/app/routes/_index/route.tsx

@@ -0,0 +1,12 @@
+import { LoaderFunctionArgs, redirect } from "@remix-run/node";
+import { validateTrieveAuth } from "app/auth";
+
+export const loader = async ({ request }: LoaderFunctionArgs) => {
+  const url = new URL(request.url);
+  // call validateTrieveAuth here to ensure the user is authenticated
+  // The first time this gets called it will create a new dataset, 
+  // calling it here prevents race conditions.
+  await validateTrieveAuth(request);
+
+  throw redirect(`/app?${url.searchParams.toString()}`);
+};

clients/trieve-shopify-extension/app/routes/app._dashboard._index.tsx

@@ -1,9 +1,8 @@
 import { useTrieve } from "app/context/trieveContext";
-import { useNavigate, useSubmit } from "@remix-run/react";
+import { useSubmit } from "@remix-run/react";
 import {
   Card,
   Text,
-  Badge,
   Button,
   SkeletonBodyText,
   DescriptionList,
@@ -38,11 +37,6 @@ import { ActionFunctionArgs } from "@remix-run/node";
 import { authenticate } from "app/shopify.server";
 import { PlanView } from "app/components/PlanView";
 
-const currencyFormatter = new Intl.NumberFormat("en-US", {
-  style: "currency",
-  currency: "USD",
-});
-
 const load: Loader = async ({ adminApiFetcher, queryClient }) => {
   await queryClient.ensureQueryData(lastStepIdQuery(adminApiFetcher));
   return;

clients/trieve-shopify-extension/app/routes/app._dashboard.chat.tsx

@@ -1,8 +1,7 @@
-import { Grid, Page, Tabs } from "@shopify/polaris";
+import { Grid, Page } from "@shopify/polaris";
 import { ChatAverageRating } from "app/components/analytics/chat/ChatAverageRating";
 import { ChatConversionRate } from "app/components/analytics/chat/ChatConversionRate";
 import { ChatRevenue } from "app/components/analytics/chat/ChatRevenue";
-import { ChatUserJourneyFunnel } from "app/components/analytics/chat/ChatUserJourneyFunnel";
 import { MessagesPerUser } from "app/components/analytics/chat/MessagesPerUser";
 import { PopularChatsTable } from "app/components/analytics/chat/PopularChatsTable";
 import { PopularSuggestedQueries } from "app/components/analytics/chat/PopularSuggestedQueries";

clients/trieve-shopify-extension/app/routes/app._dashboard.chats.tsx

@@ -19,7 +19,7 @@ import {
   AdvancedTableComponent,
   Filter,
 } from "../components/analytics/AdvancedTableComponent";
-import { Text, Badge, ChoiceList, IndexFiltersProps, RangeSlider } from "@shopify/polaris";
+import { Badge, ChoiceList, IndexFiltersProps, RangeSlider } from "@shopify/polaris";
 import { DateRangePicker } from "../components/analytics/DateRangePicker";
 import { ComponentNameSelect } from "../components/analytics/ComponentNameSelect";
 import { allChatsQuery } from "app/queries/analytics/chat";

clients/trieve-shopify-extension/app/routes/app._dashboard.tsx

@@ -19,7 +19,6 @@ import { ReactQueryDevtools } from "@tanstack/react-query-devtools";
 import { shopDatasetQuery } from "app/queries/shopDataset";
 
 export const loader = async (args: LoaderFunctionArgs) => {
-  const { session } = await authenticate.admin(args.request);
   const key = await validateTrieveAuth(args.request, false);
   if (!key.currentDatasetId) {
     console.log("No dataset selected, redirecting to /app/setup");
@@ -28,6 +27,7 @@ export const loader = async (args: LoaderFunctionArgs) => {
 
   const trieve = sdkFromKey(key);
 
+  const { session } = await authenticate.admin(args.request);
   const dataset = await trieve.getDatasetByTrackingId(session.shop);
   const organization = await trieve.getOrganizationById(
     dataset.organization_id,

clients/trieve-shopify-extension/app/routes/app.setup.tsx

@@ -1,136 +1,20 @@
 import { LoaderFunctionArgs, redirect } from "@remix-run/node";
-import { sdkFromKey, validateTrieveAuth } from "app/auth";
+import { validateTrieveAuth } from "app/auth";
 import {
   defaultCrawlOptions,
   ExtendedCrawlOptions,
 } from "app/components/DatasetSettings";
-import { getTrieveBaseUrlEnv } from "app/env.server";
-import { AdminApiCaller } from "app/loaders";
 import { buildAdminApiFetcherForServer } from "app/loaders/serverLoader";
 import { sendChunks } from "app/processors/getProducts";
-import { trackCustomerEvent } from "app/processors/shopifyTrackers";
 import { authenticate } from "app/shopify.server";
-import { TrieveKey } from "app/types";
-import { TrieveSDK } from "trieve-ts-sdk";
 
 export type AppInstallData = {
   currentAppInstallation: { id: string };
 };
 
 export const loader = async (args: LoaderFunctionArgs) => {
-  const setAppMetafields = async (
-    adminApi: AdminApiCaller,
-    trieveKey: TrieveKey,
-  ) => {
-    const response = await adminApi<AppInstallData>(`
-      #graphql
-      query {
-        currentAppInstallation {
-          id
-        }
-      }
-      `);
-
-    if (response.error) {
-      throw response.error;
-    }
-
-    const appId = response.data;
-
-    await adminApi(
-      `#graphql
-    mutation CreateAppDataMetafield($metafieldsSetInput: [MetafieldsSetInput!]!) {
-        metafieldsSet(metafields: $metafieldsSetInput) {
-          metafields {
-            id
-            namespace
-            key
-          }
-          userErrors {
-            field
-            message
-          }
-        }
-      }
-    `,
-      {
-        variables: {
-          metafieldsSetInput: [
-            {
-              namespace: "trieve",
-              key: "dataset_id",
-              value: trieveKey.currentDatasetId,
-              type: "single_line_text_field",
-              ownerId: appId.currentAppInstallation.id,
-            },
-            {
-              namespace: "trieve",
-              key: "api_key",
-              value: trieveKey.key,
-              type: "single_line_text_field",
-              ownerId: appId.currentAppInstallation.id,
-            },
-          ],
-        },
-      },
-    );
-  };
-
-
   const { session } = await authenticate.admin(args.request);
-
-  let key = await validateTrieveAuth(args.request, false);
-  const trieve = sdkFromKey(key);
-
-  let datasetId = trieve.datasetId;
-
-  let shopDataset = await trieve
-    .getDatasetByTrackingId(session.shop)
-    .catch(() => {
-      return null;
-    });
-
-  const fetcher = buildAdminApiFetcherForServer(
-    session.shop,
-    session.accessToken!,
-  );
-
-  if ((!datasetId || !shopDataset) && trieve.organizationId) {
-    if (!shopDataset) {
-      shopDataset = await trieve.createDataset({
-        dataset_name: session.shop,
-        tracking_id: session.shop,
-        server_configuration: {
-          SYSTEM_PROMPT:
-            "[[personality]]\nYou are a friendly, helpful, and knowledgeable ecommerce sales associate. Your communication style is warm, patient, and enthusiastic without being pushy. You're approachable and conversational while maintaining professionalism. You balance being personable with being efficient, understanding that customers value both connection and their time. You're solution-oriented and genuinely interested in helping customers find the right products for their needs.\n\n[[goal]]\nYour primary goal is to help customers find products that genuinely meet their needs while providing an exceptional shopping experience. You aim to:\n1. Understand customer requirements through thoughtful questions\n2. Provide relevant product recommendations based on customer preferences\n3. Offer detailed, accurate information about products\n4. Address customer concerns and objections respectfully\n5. Guide customers through the purchasing process\n6. Encourage sales without being pushy or manipulative\n7. Create a positive impression that builds long-term customer loyalty\n\n[[response structure]]\n1. Begin with a warm greeting and acknowledgment of the customer's query or concern\n2. Ask clarifying questions if needed to better understand their requirements\n3. Provide concise, relevant information that directly addresses their needs\n4. Include specific product recommendations when appropriate, with brief explanations of why they might be suitable\n5. Address any potential concerns proactively\n6. Close with a helpful next step or question that moves the conversation forward\n7. Keep responses conversational yet efficient, balancing thoroughness with respect for the customer's time.\n",
-          RAG_PROMPT:
-            "You may use the retrieved context to help you respond. When discussing products, prioritize information from the provided product data while using your general knowledge to create helpful, natural responses. If a customer asks about products or specifications not mentioned in the context, acknowledge the limitation and offer to check for more information rather than inventing details.",
-        },
-      });
-
-      key = await prisma.apiKey.update({
-        data: {
-          currentDatasetId: shopDataset.id,
-        },
-        where: {
-          shop: `${session.shop}`,
-        },
-      });
-    } else {
-      key = await prisma.apiKey.update({
-        data: {
-          currentDatasetId: shopDataset.id,
-        },
-        where: {
-          shop: `${session.shop}`,
-        },
-      });
-    }
-
-    if (key.currentDatasetId && key.key && session) {
-      setAppMetafields(fetcher, key);
-    }
-  }
+  let key = await validateTrieveAuth(args.request, true);
 
   let crawlSettings = await prisma.crawlSettings.findFirst({
     where: {
@@ -148,19 +32,11 @@ export const loader = async (args: LoaderFunctionArgs) => {
       },
     });
   }
-
-  datasetId = shopDataset?.id;
-  if (!datasetId) {
-    throw new Response("Error choosing default dataset, need to create one", {
-      status: 500,
-    });
-  }
-
   const crawlOptions = crawlSettings.crawlSettings as ExtendedCrawlOptions;
 
   await prisma.crawlSettings.upsert({
     create: {
-      datasetId: datasetId,
+      datasetId: key.currentDatasetId,
       shop: session.shop,
       crawlSettings: crawlOptions,
     },
@@ -169,16 +45,19 @@ export const loader = async (args: LoaderFunctionArgs) => {
     },
     where: {
       datasetId_shop: {
-        datasetId: datasetId,
+        datasetId: key.currentDatasetId,
         shop: session.shop,
       },
     },
   });
 
-  sendChunks(datasetId ?? "", key, fetcher, session, crawlOptions).catch(
+  const fetcher = buildAdminApiFetcherForServer(
+    session.shop,
+    session.accessToken!,
+  );
+  sendChunks(key.currentDatasetId ?? "", key, fetcher, session, crawlOptions).catch(
     console.error,
   );
 
-  trieve.datasetId = datasetId;
   return redirect("/app");
 };