Skip to content

Commit

Permalink
initial structure
Browse files Browse the repository at this point in the history
  • Loading branch information
jakewheeler committed Oct 25, 2024
1 parent 8e939d5 commit 65c4147
Showing 1 changed file with 281 additions and 17 deletions.
298 changes: 281 additions & 17 deletions src/app/our-products/page.tsx
Original file line number Diff line number Diff line change
@@ -1,23 +1,287 @@
import Link from 'next/link';
import { Button, Grid, GridContainer } from '@trussworks/react-uswds';
import Image from 'next/image';
import { basePath } from '../utils/constants';

export default function ProductDetail() {
export default function OurProducts() {
return (
<div>
<h1>Our Products</h1>
<ul>
<li>
<Link href="/">Home</Link>
</li>
<li>
<Link href="/our-products">Our products</Link>
</li>
<li>
<Link href="/product-detail">Product detail</Link>
</li>
<li>
<Link href="/resources">Resources</Link>
</li>
</ul>
<section className="usa-graphic-list usa-section usa-section--light-blue">
<GridContainer>
<div>
<h1>Our ecosystem of DIBBs products</h1>
<p className="grid-container p-0">
Find out how DIBBs products can help empower your jurisdiction
</p>
</div>
</GridContainer>
</section>
<section className="usa-section">
<GridContainer>
<h2>Standalone Products</h2>
<Grid row gap className="usa-graphic-list__row">
<Grid
tablet={{
col: true,
}}
>
<Image
src={`${basePath}/images/placeholder.png`}
width="540"
height="280"
alt="Placeholder"
/>
<div>
<h2 className="usa-graphic-list__heading">eCR Viewer</h2>
<p>
Graphic headings can be used a few different ways, depending
on what your landing page is for. Highlight your values,
specific program areas, or results.
</p>
<Button type="button">Learn more about eCR Viewer</Button>
</div>
</Grid>
<Grid
tablet={{
col: true,
}}
>
<Image
src={`${basePath}/images/placeholder.png`}
width="540"
height="280"
alt="Placeholder"
/>
<div>
<h2 className="usa-graphic-list__heading">Query Connector</h2>
<p>
Allows public health staff to query a wide network of
healthcare organizations for data relevant to a given
condition. It gives staff access to more complete and timely
data without the need for a direct connection to a healthcare
provider.
</p>
<Button type="button">Learn more about Query Connector</Button>
</div>
</Grid>
</Grid>
<Grid row gap="lg" className="usa-graphic-list__row">
<Grid
tablet={{
col: true,
}}
>
<Image
src={`${basePath}/images/placeholder.png`}
width="540"
height="280"
alt="Placeholder"
/>
<div>
<h2 className="usa-graphic-list__heading">eCR Parser</h2>
<p>
Enables public health staff to extract relevant data from eCR
messages based on a user-defined parsing schema. It exports
that data into a simple JSON file that can be easily loaded
into a tabular format (like a spreadsheet).
</p>
<Button type="button">Learn more about eCR Parser</Button>
</div>
</Grid>
<Grid
tablet={{
col: true,
}}
>
<Image
src={`${basePath}/images/placeholder.png`}
width="540"
height="280"
alt="Placeholder"
/>
<div>
<h2 className="usa-graphic-list__heading">eCR Refiner</h2>
<p>
Reduces eCR files down to only the most useful, necessary
information to alleviate performance and storage burden on
disease surveillance systems and bring focus to pertinent data
for a given condition.
</p>
<Button type="button">Learn more about eCR Parser</Button>
</div>
</Grid>
</Grid>
</GridContainer>
</section>
<section className="usa-section">
<GridContainer>
<Grid>
<Image
src={`${basePath}/images/placeholder.png`}
width="1120"
height="160"
style={{ maxHeight: '160px' }}
alt="Placeholder"
/>
<h2>DIBBs to support the entire data pipeline</h2>
<p>
These are the underlying services that power each of our products;
they can be configured in a variety of ways to support the unique
needs of your jurisdiction.
</p>
</Grid>
</GridContainer>
<GridContainer>
<h3>For Data Processing</h3>
<Grid row gap="lg" className="usa-graphic-list__row">
<Grid
tablet={{
col: true,
}}
>
<Image
src={`${basePath}/icons/orchestration.svg`}
width="88"
height="88"
alt="Placeholder"
/>
<p className="font-bold">Orchestration</p>
<p>
Enables coordinated execution of DIBBs in any order, allowing
for fully automated workflows
</p>
</Grid>
<Grid
tablet={{
col: true,
}}
>
<Image
src={`${basePath}/icons/fhirConverter.svg`}
width="88"
height="88"
alt="Placeholder"
/>
<p className="font-bold">FHIR Converter</p>
<p>
Enables coordinated execution of DIBBs in any order, allowing
for fully automated workflows
</p>
</Grid>
<Grid
tablet={{
col: true,
}}
>
<Image
src={`${basePath}/icons/validation.svg`}
width="88"
height="88"
alt="Placeholder"
/>
<p className="font-bold">Validation</p>
<p>
Enables coordinated execution of DIBBs in any order, allowing
for fully automated workflows
</p>
</Grid>
</Grid>
</GridContainer>
<GridContainer>
<h3>For Data Enrichment</h3>
<Grid row gap="lg" className="usa-graphic-list__row">
<Grid
tablet={{
col: true,
}}
>
<Image
src={`${basePath}/icons/code.svg`}
width="88"
height="88"
alt="Placeholder"
/>
<p className="font-bold">Standardization</p>
<p>
Enables coordinated execution of DIBBs in any order, allowing
for fully automated workflows
</p>
</Grid>
<Grid
tablet={{
col: true,
}}
>
<Image
src={`${basePath}/icons/messageParser.svg`}
width="88"
height="88"
alt="Placeholder"
/>
<p className="font-bold">Geocoding</p>
<p>
Enables coordinated execution of DIBBs in any order, allowing
for fully automated workflows
</p>
</Grid>
<Grid
tablet={{
col: true,
}}
>
<Image
src={`${basePath}/icons/link.svg`}
width="88"
height="88"
alt="Placeholder"
/>
<p className="font-bold">Record Linkage</p>
<p>
Enables coordinated execution of DIBBs in any order, allowing
for fully automated workflows
</p>
</Grid>
</Grid>
</GridContainer>
<GridContainer>
<h3>For Data Transformation</h3>
<Grid row gap="lg" className="usa-graphic-list__row">
<Grid
tablet={{
col: true,
}}
>
<Image
src={`${basePath}/icons/code.svg`}
width="88"
height="88"
alt="Placeholder"
/>
<p className="font-bold">Flat Formatter</p>
<p>
Enables coordinated execution of DIBBs in any order, allowing
for fully automated workflows
</p>
</Grid>
<Grid
tablet={{
col: true,
}}
>
<Image
src={`${basePath}/icons/messageParser.svg`}
width="88"
height="88"
alt="Placeholder"
/>
<p className="font-bold">PHDC Converter</p>
<p>
Enables coordinated execution of DIBBs in any order, allowing
for fully automated workflows
</p>
</Grid>
</Grid>
</GridContainer>
</section>
</div>
);
}

0 comments on commit 65c4147

Please sign in to comment.