console: update onboarding messages for the new template schema

PR-URL: https://github.com/hasura/graphql-engine-mono/pull/6221
GitOrigin-RevId: 1276a6208e34f20e735daaf856a1e099e52d3338

console/src/features/OnboardingWizard/components/QueryDialog/QueryDialog.tsx

@@ -27,9 +27,9 @@ export function QueryDialog(props: Props) {
         <div className="mx-4 my-2">
           <div className="text-md text-gray-700 mb-2">
             We&apos;ve created a <b>`sample`</b> schema to help you get started
-            using Hasura. It contains the sample structure of a music directory,
-            as well as a view and function to give you an idea about how Hasura
-            works.
+            using Hasura. It contains the sample structure of a music directory
+            with two tables ‘Albums’ and ‘Artists’ based on a foreign key
+            relationship.
           </div>
           <img
             className="mb-2"

console/src/features/OnboardingWizard/components/QueryDialog/TemplateSummary.tsx

@@ -10,38 +10,21 @@ import {
 import { QueryDialog } from './QueryDialog';
 import {
   fetchTemplateDataQueryFn,
-  getQueryFromSampleQueries,
   runQueryInGraphiQL,
   fillSampleQueryInGraphiQL,
   emitOnboardingEvent,
 } from '../../utils';
 
-const defaultQuery = `
-# Lookup artist info, albums, tracks based on relations
-# Filter for only 'ArtistId' with the ID of '22'
-
-query lookupArtist {
-    sample_Artist(where: {ArtistId: {_eq: 22}}) {
-            ArtistId
-            Name
-            Albums {
-            AlbumId
-            Title
-            Tracks {
-                TrackId
-                Name
-            }
-        }
-    }
-}
-`;
-
 type Props = {
   templateUrl: string;
   dismiss: VoidFunction;
   dispatch: Dispatch;
 };
 
+const defaultQuery = `
+# Make a GraphQL query
+`;
+
 export function TemplateSummary(props: Props) {
   const { templateUrl, dismiss, dispatch } = props;
   const schemaImagePath = `${templateUrl}/diagram.png`;
@@ -53,23 +36,6 @@ export function TemplateSummary(props: Props) {
     queryKey: sampleQueriesPath,
     queryFn: () => fetchTemplateDataQueryFn(sampleQueriesPath, {}),
     staleTime,
-    onSuccess: (allQueries: string) => {
-      try {
-        const gqlQuery = getQueryFromSampleQueries(allQueries, 'lookupArtist');
-        setSampleQuery(gqlQuery || defaultQuery);
-      } catch (e: any) {
-        // this is unexpected; so get alerted
-        tracingTools.sentry.captureException(
-          new Error('failed to get a sample query in template summary'),
-          {
-            debug: {
-              error: 'message' in e ? e.message : e,
-              trace: 'OnboardingWizard/TemplateSummary',
-            },
-          }
-        );
-      }
-    },
     onError: (e: any) => {
       // this is unexpected; so get alerted
       tracingTools.sentry.captureException(
@@ -86,15 +52,18 @@ export function TemplateSummary(props: Props) {
 
   // this effect makes sure that the query is filled in GraphiQL as soon as possible
   React.useEffect(() => {
-    if (sampleQueriesData) {
-      fillSampleQueryInGraphiQL(sampleQuery, dispatch);
+    if (typeof sampleQueriesData === 'string') {
+      setSampleQuery(sampleQueriesData);
+      fillSampleQueryInGraphiQL(sampleQueriesData, dispatch);
     }
-  }, [sampleQueriesData, sampleQuery]);
+  }, [sampleQueriesData]);
 
   // this runs the query that is prefilled in graphiql
   const onRunHandler = () => {
     emitOnboardingEvent(templateSummaryRunQueryClickVariables);
-    runQueryInGraphiQL();
+    if (sampleQueriesData) {
+      runQueryInGraphiQL();
+    }
     dismiss();
   };
   const onSkipHandler = () => {