From 19795dd6f78e6960178d1340e25309406174ba7d Mon Sep 17 00:00:00 2001 From: fzhao99 Date: Tue, 7 Jan 2025 10:54:20 -0500 Subject: [PATCH] new content for query building empty state (#246) --- .../src/app/backend/dbCreation/db-creation.ts | 33 +++++---- .../app/queryBuilding/QueryBuilding.test.tsx | 7 +- .../__snapshots__/QueryBuilding.test.tsx.snap | 56 +++++++++++++++ .../components/ConditionSelection.tsx | 2 +- .../querySelection/EmptyQueriesDisplay.tsx | 69 ++++++++++++------- .../{MyQueries.tsx => QueryLibrary.tsx} | 2 +- .../querySelection/QuerySelection.tsx | 12 ++-- .../querySelection/WorkspaceSetUp.tsx | 60 +++++++--------- .../querySelection/querySelection.module.scss | 15 +++- 9 files changed, 169 insertions(+), 87 deletions(-) create mode 100644 query-connector/src/app/queryBuilding/__snapshots__/QueryBuilding.test.tsx.snap rename query-connector/src/app/queryBuilding/querySelection/{MyQueries.tsx => QueryLibrary.tsx} (99%) diff --git a/query-connector/src/app/backend/dbCreation/db-creation.ts b/query-connector/src/app/backend/dbCreation/db-creation.ts index b5e999b9..59dab9cf 100644 --- a/query-connector/src/app/backend/dbCreation/db-creation.ts +++ b/query-connector/src/app/backend/dbCreation/db-creation.ts @@ -345,6 +345,8 @@ async function insertSeedDbStructs(structType: string) { /** * Overall orchestration function that performs the scripted process of querying * the eRSD, extracting OIDs, then inserting valuesets into the DB. + * @returns a { success: true/false reload: true/false } status dictionary for + * whether the creation failed / needs a reload on the frontend for display */ export async function createDibbsDB() { // Check if the DB already contains valuesets @@ -358,20 +360,27 @@ export async function createDibbsDB() { console.error("Could not load eRSD, aborting DIBBs DB creation"); } - // Only run default and custom insertions if we're making the dump - // file for dev - // if (process.env.NODE_ENV !== "production") { - await insertSeedDbStructs("valuesets"); - await insertSeedDbStructs("concepts"); - await insertSeedDbStructs("valueset_to_concept"); - await insertSeedDbStructs("conditions"); - await insertSeedDbStructs("condition_to_valueset"); - await insertSeedDbStructs("query"); - await insertSeedDbStructs("category"); - await executeCategoryUpdates(); + try { + // Only run default and custom insertions if we're making the dump + // file for dev + // if (process.env.NODE_ENV !== "production") { + await insertSeedDbStructs("valuesets"); + await insertSeedDbStructs("concepts"); + await insertSeedDbStructs("valueset_to_concept"); + await insertSeedDbStructs("conditions"); + await insertSeedDbStructs("condition_to_valueset"); + await insertSeedDbStructs("query"); + await insertSeedDbStructs("category"); + await executeCategoryUpdates(); + return { success: false, reload: false }; - // } + // } + } catch { + console.error("DB reload failed"); + return { succes: false, reload: false }; + } } else { console.log("Database already has data; skipping DIBBs DB creation."); + return { success: true, reload: false }; } } diff --git a/query-connector/src/app/queryBuilding/QueryBuilding.test.tsx b/query-connector/src/app/queryBuilding/QueryBuilding.test.tsx index 580c5970..5b147b80 100644 --- a/query-connector/src/app/queryBuilding/QueryBuilding.test.tsx +++ b/query-connector/src/app/queryBuilding/QueryBuilding.test.tsx @@ -25,10 +25,9 @@ describe("tests the query building steps", () => { // Wait for the asynchronous data to resolve and the component to update await waitFor(() => { - expect(screen.getByText("My queries")).toBeInTheDocument(); - expect( - screen.getByText("No custom queries available"), - ).toBeInTheDocument(); + expect(screen.getByText("Start with Query Builder")).toBeInTheDocument(); + + expect(screen).toMatchSnapshot(); }); }); }); diff --git a/query-connector/src/app/queryBuilding/__snapshots__/QueryBuilding.test.tsx.snap b/query-connector/src/app/queryBuilding/__snapshots__/QueryBuilding.test.tsx.snap new file mode 100644 index 00000000..d2a96ca4 --- /dev/null +++ b/query-connector/src/app/queryBuilding/__snapshots__/QueryBuilding.test.tsx.snap @@ -0,0 +1,56 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`tests the query building steps renders 1`] = ` +{ + "debug": [Function], + "findAllByAltText": [Function], + "findAllByDisplayValue": [Function], + "findAllByLabelText": [Function], + "findAllByPlaceholderText": [Function], + "findAllByRole": [Function], + "findAllByTestId": [Function], + "findAllByText": [Function], + "findAllByTitle": [Function], + "findByAltText": [Function], + "findByDisplayValue": [Function], + "findByLabelText": [Function], + "findByPlaceholderText": [Function], + "findByRole": [Function], + "findByTestId": [Function], + "findByText": [Function], + "findByTitle": [Function], + "getAllByAltText": [Function], + "getAllByDisplayValue": [Function], + "getAllByLabelText": [Function], + "getAllByPlaceholderText": [Function], + "getAllByRole": [Function], + "getAllByTestId": [Function], + "getAllByText": [Function], + "getAllByTitle": [Function], + "getByAltText": [Function], + "getByDisplayValue": [Function], + "getByLabelText": [Function], + "getByPlaceholderText": [Function], + "getByRole": [Function], + "getByTestId": [Function], + "getByText": [Function], + "getByTitle": [Function], + "logTestingPlaygroundURL": [Function], + "queryAllByAltText": [Function], + "queryAllByDisplayValue": [Function], + "queryAllByLabelText": [Function], + "queryAllByPlaceholderText": [Function], + "queryAllByRole": [Function], + "queryAllByTestId": [Function], + "queryAllByText": [Function], + "queryAllByTitle": [Function], + "queryByAltText": [Function], + "queryByDisplayValue": [Function], + "queryByLabelText": [Function], + "queryByPlaceholderText": [Function], + "queryByRole": [Function], + "queryByTestId": [Function], + "queryByText": [Function], + "queryByTitle": [Function], +} +`; diff --git a/query-connector/src/app/queryBuilding/components/ConditionSelection.tsx b/query-connector/src/app/queryBuilding/components/ConditionSelection.tsx index fc0d51ab..24bfe90d 100644 --- a/query-connector/src/app/queryBuilding/components/ConditionSelection.tsx +++ b/query-connector/src/app/queryBuilding/components/ConditionSelection.tsx @@ -97,7 +97,7 @@ export const ConditionSelection: React.FC = ({ )} >
-

Select condition(s)

+

Select condition template(s)

void; +}; /** * Empty-state component for query building + * @param root0 - params + * @param root0.goForward - navigation function to go to the next page * @returns the EmptyQueriesDisplay to render the empty state status */ -export const EmptyQueriesDisplay: React.FC = () => { +export const EmptyQueriesDisplay: React.FC = ({ + goForward, +}) => { const [loading, setLoading] = useState(false); const handleClick = async () => { @@ -17,44 +25,55 @@ export const EmptyQueriesDisplay: React.FC = () => { // DB Creation Function console.log("Creating DB..."); - await createDibbsDB(); + const { reload } = await createDibbsDB(); // Stop loading and redirect once function is complete setLoading(false); - // Refresh query building page to display the now seeded values - location.reload(); + if (reload) { + // Refresh query building page to display the now seeded values + location.reload(); + } else { + goForward(); + } }; if (loading) { - return ; + return ; } return ( <> -
-
- -

- No custom queries available -

+

Query Library

+ +
+
+

Start with Query Builder

+

+ Create custom queries that your staff can use to search for relevant + data +

+ +
    +
  • + Leverage our pre-populated templates with public + health codes from LOINC, ICD-10, SNOMED, and more. +
    • +
  • + Decide which codes to include in each query. +
    • +
  • + Combine codes from different conditions. +
    • +
diff --git a/query-connector/src/app/queryBuilding/querySelection/MyQueries.tsx b/query-connector/src/app/queryBuilding/querySelection/QueryLibrary.tsx similarity index 99% rename from query-connector/src/app/queryBuilding/querySelection/MyQueries.tsx rename to query-connector/src/app/queryBuilding/querySelection/QueryLibrary.tsx index 6f37b618..9c99f7a8 100644 --- a/query-connector/src/app/queryBuilding/querySelection/MyQueries.tsx +++ b/query-connector/src/app/queryBuilding/querySelection/QueryLibrary.tsx @@ -73,7 +73,7 @@ export const MyQueriesDisplay: React.FC = ({ context, )}
-

My queries

+

Query Library