Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

add ecr retrieval failed page #2882

Merged
merged 8 commits into from
Nov 12, 2024
Merged

add ecr retrieval failed page #2882

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
33cb59a
add ecr retrieval failed page
lina-roth Nov 8, 2024
e554304
[pre-commit.ci] auto fixes from pre-commit hooks
pre-commit-ci[bot] Nov 8, 2024
195fab0
Merge branch 'main' into lr/retrieval-dailed
lina-roth Nov 8, 2024
55b6d0e
[pre-commit.ci] auto fixes from pre-commit hooks
pre-commit-ci[bot] Nov 8, 2024
819747e
switch error page
lina-roth Nov 8, 2024
3d21ce9
Merge branch 'lr/retrieval-dailed' of github.com:CDCgov/phdi into lr/…
lina-roth Nov 8, 2024
6f25cc7
remove error page
lina-roth Nov 8, 2024
2a5b1fb
Remove empty tag
lina-roth Nov 8, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
42 changes: 19 additions & 23 deletions containers/ecr-viewer/src/app/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,34 +30,30 @@ const HomePage = async ({
totalCount = await getTotalEcrCount(searchTerm);
}

return (
return isNonIntegratedViewer ? (
<div className="display-flex flex-column height-viewport">
<Header />
<main className="overflow-auto height-full">
{isNonIntegratedViewer ? (
<>
<div className="margin-x-3 padding-y-105 display-flex flex-align-center">
<span className="text-bold font-sans-xl">eCR Library</span>{" "}
<LibrarySearch
className="margin-left-auto"
textBoxClassName="width-21-9375"
/>
</div>
<EcrPaginationWrapper totalCount={totalCount}>
<EcrTable
currentPage={currentPage}
itemsPerPage={itemsPerPage}
sortColumn={sortColumn}
sortDirection={sortDirection}
searchTerm={searchTerm}
/>
</EcrPaginationWrapper>
</>
) : (
<NotFound />
)}
<div className="margin-x-3 padding-y-105 display-flex flex-align-center">
<span className="text-bold font-sans-xl">eCR Library</span>{" "}
<LibrarySearch
className="margin-left-auto"
textBoxClassName="width-21-9375"
/>
</div>
<EcrPaginationWrapper totalCount={totalCount}>
<EcrTable
currentPage={currentPage}
itemsPerPage={itemsPerPage}
sortColumn={sortColumn}
sortDirection={sortDirection}
searchTerm={searchTerm}
/>
</EcrPaginationWrapper>
</main>
</div>
) : (
<NotFound />
);
};

Expand Down
2 changes: 1 addition & 1 deletion containers/ecr-viewer/src/app/tests/view-data.test.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,7 @@ describe("ECRViewerPage", () => {

render(<ECRViewerPage />);

expect(await screen.findByText("Page not found"));
expect(await screen.findByText("eCR retrieval failed"));
});

it("should handle 500 error", async () => {
Expand Down
4 changes: 2 additions & 2 deletions containers/ecr-viewer/src/app/view-data/page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ import { metrics } from "./component-utils";
import { EcrLoadingSkeleton } from "./components/LoadingComponent";
import Header from "../Header";
import PatientBanner from "./components/PatientBanner";
import NotFound from "../not-found";
import RetrievalFailed from "./retrieval-failed";

interface FetchError {
status: number;
Expand Down Expand Up @@ -79,7 +79,7 @@ const ECRViewerPage: React.FC = () => {

if (errors) {
if (errors.status === 404) {
return <NotFound />;
return <RetrievalFailed />;
}
return (
<div>
Expand Down
39 changes: 39 additions & 0 deletions containers/ecr-viewer/src/app/view-data/retrieval-failed.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@
"use client";
import React from "react";
import { Icon } from "@trussworks/react-uswds";
import Header from "../Header";

/**
* @returns The ecr retrieval error page JSX component.
*/
const RetrievalFailed = () => (
<div className="height-viewport width-viewport display-flex flex-column">
<Header />
<main className="display-flex flex-justify-center height-full">
<div className="display-inline-block margin-y-auto">
<h2 className="font-family-serif font-serif-xl margin-bottom-0">
<Icon.Error
size={5}
className="margin-right-105 text-middle"
aria-hidden
/>
eCR retrieval failed
</h2>
<div className="text-semibold font-sans-md margin-top-1">
The eCR Viewer couldn't retrieve the associated eCR file
</div>
<div className="bg-info-lighter border border-info-light radius-md font-sans-md line-height-sans-4 padding-3 margin-top-2">
This is likely because the DIBBs pipeline hasn't processed this eCR.
<p />
<div className="margin-0">
<b>Contact support:</b> If the problem persists, please reach out to
your eCR coordinator
<br /> to troubleshoot the issue with the DIBBs team.
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

why do we need the <br /> here - should we instead defer to css to make sure the wrapping happens appropriately?

Copy link
Collaborator Author

@lina-roth lina-roth Nov 8, 2024 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

id normally agree but this being a static page with content that is unlikely to change, I dont feel like using text-wrap over "br" is really much of a difference

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

how does it look on mobile?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I need to double check but I dont think we are concerned with mobile for this app

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Screen Shot 2024-11-08 at 4 36 01 PM

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

thanks! I could see it being weird at some widths, but if we're not worried about mobile, those odds are way low and I agree it doesn't make much difference here

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

though I suppose things could get weird again if someone has different font sizes set on their settings? 🤔

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

i asked Emma and she said "our assumption is that all users will be in a desktop/workplace setting"

</div>
</div>
</div>
</main>
</div>
);

export default RetrievalFailed;
Loading