Export and use `SAMPLE_DB_ID` for snapshot generation (#20726)

* Export `SAMPLE_DB_ID`

* Replace hard coded sample database id values in the default snapshot creator

* Replace hard coded values for the SQLite database

* Update function name

* Stop using hard coded values for questions and dashboards

frontend/test/__support__/e2e/cypress_data.js

+export const SAMPLE_DB_ID = 1;
+
 export const USER_GROUPS = {
   ALL_USERS_GROUP: 1,
   ADMIN_GROUP: 2,

frontend/test/snapshot-creators/default.cy.snap.js

 import _ from "underscore";
 import { snapshot, restore, withSampleDatabase } from "__support__/e2e/cypress";
-import { USERS, USER_GROUPS } from "__support__/e2e/cypress_data";
+import { USERS, USER_GROUPS, SAMPLE_DB_ID } from "__support__/e2e/cypress_data";
 
 const {
   ALL_USERS_GROUP,
@@ -20,7 +20,7 @@ describe("snapshots", () => {
       addUsersAndGroups();
       createCollections();
       withSampleDatabase(SAMPLE_DATABASE => {
-        createQuestionAndDashboard(SAMPLE_DATABASE);
+        createQuestionsAndDashboards(SAMPLE_DATABASE);
         cy.writeFile(
           "frontend/test/__support__/e2e/cypress_sample_database.json",
           SAMPLE_DATABASE,
@@ -59,10 +59,10 @@ describe("snapshots", () => {
     });
 
     // update the Sample db connection string so it is valid in both CI and locally
-    cy.request("GET", "/api/database/1").then(response => {
+    cy.request("GET", `/api/database/${SAMPLE_DB_ID}`).then(response => {
       response.body.details.db =
         "./resources/sample-database.db;USER=GUEST;PASSWORD=guest";
-      cy.request("PUT", "/api/database/1", response.body);
+      cy.request("PUT", `/api/database/${SAMPLE_DB_ID}`, response.body);
     });
   }
 
@@ -98,13 +98,21 @@ describe("snapshots", () => {
     cy.request("GET", "/api/user");
 
     cy.updatePermissionsGraph({
-      [ALL_USERS_GROUP]: { "1": { data: { schemas: "none", native: "none" } } },
-      [DATA_GROUP]: { "1": { data: { schemas: "all", native: "write" } } },
-      [NOSQL_GROUP]: { "1": { data: { schemas: "all", native: "none" } } },
+      [ALL_USERS_GROUP]: {
+        [SAMPLE_DB_ID]: { data: { schemas: "none", native: "none" } },
+      },
+      [DATA_GROUP]: {
+        [SAMPLE_DB_ID]: { data: { schemas: "all", native: "write" } },
+      },
+      [NOSQL_GROUP]: {
+        [SAMPLE_DB_ID]: { data: { schemas: "all", native: "none" } },
+      },
       [COLLECTION_GROUP]: {
-        "1": { data: { schemas: "none", native: "none" } },
+        [SAMPLE_DB_ID]: { data: { schemas: "none", native: "none" } },
+      },
+      [READONLY_GROUP]: {
+        [SAMPLE_DB_ID]: { data: { schemas: "none", native: "none" } },
       },
-      [READONLY_GROUP]: { "1": { data: { schemas: "none", native: "none" } } },
     });
 
     cy.updateCollectionGraph({
@@ -135,9 +143,32 @@ describe("snapshots", () => {
     );
   }
 
-  function createQuestionAndDashboard({ ORDERS, ORDERS_ID }) {
+  function createQuestionsAndDashboards({ ORDERS, ORDERS_ID }) {
     // question 1: Orders
-    cy.createQuestion({ name: "Orders", query: { "source-table": ORDERS_ID } });
+    const questionDetails = {
+      name: "Orders",
+      query: { "source-table": ORDERS_ID },
+    };
+
+    // dashboard 1: Orders in a dashboard
+    const dashboardDetails = { name: "Orders in a dashboard" };
+
+    cy.createQuestionAndDashboard({ questionDetails, dashboardDetails }).then(
+      ({ body: { id, card_id, dashboard_id } }) => {
+        cy.request("PUT", `/api/dashboard/${dashboard_id}/cards`, {
+          cards: [
+            {
+              id,
+              card_id,
+              row: 0,
+              col: 0,
+              sizeX: 12,
+              sizeY: 8,
+            },
+          ],
+        });
+      },
+    );
 
     // question 2: Orders, Count
     cy.createQuestion({
@@ -145,6 +176,7 @@ describe("snapshots", () => {
       query: { "source-table": ORDERS_ID, aggregation: [["count"]] },
     });
 
+    // question 3: Orders, Count, Grouped by Created At (year)
     cy.createQuestion({
       name: "Orders, Count, Grouped by Created At (year)",
       query: {
@@ -154,25 +186,6 @@ describe("snapshots", () => {
       },
       display: "line",
     });
-
-    // dashboard 1: Orders in a dashboard
-    cy.createDashboard({ name: "Orders in a dashboard" });
-    cy.request("POST", `/api/dashboard/1/cards`, { cardId: 1 }).then(
-      ({ body: { id: dashCardId } }) => {
-        cy.request("PUT", `/api/dashboard/1/cards`, {
-          cards: [
-            {
-              id: dashCardId,
-              card_id: 1,
-              row: 0,
-              col: 0,
-              sizeX: 12,
-              sizeY: 8,
-            },
-          ],
-        });
-      },
-    );
   }
 
   // TODO: It'd be nice to have one file per snapshot.
@@ -202,17 +215,18 @@ describe("snapshots", () => {
             schedule_type: "hourly",
           },
         },
+      }).then(({ body: { id } }) => {
+        cy.request("POST", `/api/database/${id}/sync_schema`);
+        cy.request("POST", `/api/database/${id}/rescan_values`);
+        cy.wait(1000); // wait for sync
+        snapshot("withSqlite");
+        // TODO: Temporary HACK that requires further investigation and a better solution.
+        // sqlite driver was messing with the sync of postres database in CY tests
+        // ("probably some weird race condition" @Damon)
+        // Deleting it here keeps snapshots intact, and enables for unobstructed postgres testing.
+        cy.request("DELETE", `/api/database/${id}`);
+        restore("blank");
       });
-      cy.request("POST", "/api/database/2/sync_schema");
-      cy.request("POST", "/api/database/2/rescan_values");
-      cy.wait(1000); // wait for sync
-      snapshot("withSqlite");
-      // TODO: Temporary HACK that requires further investigation and a better solution.
-      // sqlite driver was messing with the sync of postres database in CY tests
-      // ("probably some weird race condition" @Damon)
-      // Deleting it here keeps snapshots intact, and enables for unobstructed postgres testing.
-      cy.request("DELETE", "/api/database/2");
-      restore("blank");
     });
   });
 });