diff --git a/containers/ecr-viewer/src/app/components/EcrTableClient.tsx b/containers/ecr-viewer/src/app/components/EcrTableClient.tsx index a6c1db924..8098bf38a 100644 --- a/containers/ecr-viewer/src/app/components/EcrTableClient.tsx +++ b/containers/ecr-viewer/src/app/components/EcrTableClient.tsx @@ -8,6 +8,7 @@ import { usePathname, useSearchParams, useRouter } from "next/navigation"; import { noData, range } from "../view-data/utils/utils"; import classNames from "classnames"; import Link from "next/link"; +import { saveToSessionStorage } from "./utils"; type EcrTableClientProps = { data: EcrDisplay[]; @@ -66,7 +67,7 @@ const initialHeaders = [ { id: "reportable_condition", value: "Reportable Condition", - className: "library-condition-colum", + className: "library-condition-column", dataSortable: false, sortDirection: "", }, @@ -277,6 +278,8 @@ const DataRow = ({ item }: { item: EcrDisplay }) => { const patient_first_name = toSentenceCase(item.patient_first_name); const patient_last_name = toSentenceCase(item.patient_last_name); + const searchParams = useSearchParams(); + const conditionsList = ( ); + const saveUrl = () => { + saveToSessionStorage("urlParams", searchParams.toString()); + }; return ( - + {patient_first_name} {patient_last_name}
diff --git a/containers/ecr-viewer/src/app/components/utils.ts b/containers/ecr-viewer/src/app/components/utils.ts new file mode 100644 index 000000000..dd51e6800 --- /dev/null +++ b/containers/ecr-viewer/src/app/components/utils.ts @@ -0,0 +1,34 @@ +/** + * Saves a key-value pair to session storage. + * @param key - The key under which the value will be stored. + * @param value - The value to be stored. Can be a string or any serializable object. + */ +export const saveToSessionStorage = ( + key: string, + value: string | object, +): void => { + const serializedValue = JSON.stringify(value); + + if (typeof window !== "undefined" && window.sessionStorage) { + sessionStorage.setItem(key, serializedValue); + } else { + console.warn("sessionStorage is not available"); + } +}; + +/** + * Retrieves a key-value pair from session storage. + * @param key - The key under which the value was stored. + * @returns string or null - The stored value from session storage or null if it finds nothing + */ +export const retrieveFromSessionStorage = ( + key: string, +): string | object | null => { + if (typeof window !== "undefined" && window.sessionStorage) { + const storedValue = sessionStorage.getItem(key); + return JSON.parse(storedValue); + } else { + console.warn("sessionStorage is not available"); + return null; + } +}; diff --git a/containers/ecr-viewer/src/app/tests/components/Utils.test.tsx b/containers/ecr-viewer/src/app/tests/components/Utils.test.tsx new file mode 100644 index 000000000..5886ea266 --- /dev/null +++ b/containers/ecr-viewer/src/app/tests/components/Utils.test.tsx @@ -0,0 +1,62 @@ +import { + saveToSessionStorage, + retrieveFromSessionStorage, +} from "../../components/utils.ts"; + +describe("Session Storage saving utils", () => { + beforeEach(() => { + sessionStorage.clear(); + }); + + describe("saveToSessionStorage", () => { + it("should save a string value to session storage", () => { + const key = "Bread"; + const value = "Baguette"; + saveToSessionStorage(key, value); + + expect(sessionStorage.getItem(key)).toBe(JSON.stringify(value)); + }); + + it("should save an object value to session storage", () => { + const key = "testKey"; + const value = { name: "Heironymous", age: 37 }; + saveToSessionStorage(key, value); + + expect(sessionStorage.getItem(key)).toBe(JSON.stringify(value)); + }); + }); + + describe("retrieveFromSessionStorage", () => { + it("should retrieve a string value from session storage", () => { + const key = "fruit"; + const value = "Apples"; + sessionStorage.setItem(key, JSON.stringify(value)); + + const retrievedValue = retrieveFromSessionStorage(key); + expect(retrievedValue).toBe(value); + }); + + it("should retrieve an object value from session storage", () => { + const key = "patient"; + const value = { name: "Arabelle", age: 22 }; + sessionStorage.setItem(key, JSON.stringify(value)); + + const retrievedValue = retrieveFromSessionStorage(key); + expect(retrievedValue).toEqual(value); + }); + + it("should return null if the key does not exist", () => { + const key = "nonExistentKey"; + const retrievedValue = retrieveFromSessionStorage(key); + + expect(retrievedValue).toBeNull(); + }); + + it("should throw an error for invalid JSON in session storage", () => { + const key = "aKey"; + sessionStorage.setItem(key, "invalid-json"); + + expect(() => retrieveFromSessionStorage(key)).toThrow(SyntaxError); + }); + }); +}); diff --git a/containers/ecr-viewer/src/app/tests/components/__snapshots__/EcrTable.test.tsx.snap b/containers/ecr-viewer/src/app/tests/components/__snapshots__/EcrTable.test.tsx.snap index 6996bb478..706e465ce 100644 --- a/containers/ecr-viewer/src/app/tests/components/__snapshots__/EcrTable.test.tsx.snap +++ b/containers/ecr-viewer/src/app/tests/components/__snapshots__/EcrTable.test.tsx.snap @@ -74,7 +74,7 @@ exports[`EcrTable Snapshot test for EcrTableLoading should match snapshot 1`] = { const isNonIntegratedViewer = env("NEXT_PUBLIC_NON_INTEGRATED_VIEWER") === "true"; + + const savedUrlParams = retrieveFromSessionStorage("urlParams"); + return ( <> {isNonIntegratedViewer ? (