Skip to content

Commit

Permalink
Merge pull request #1 from ConductionNL/feature/update-cards
Browse files Browse the repository at this point in the history
feature/update-cards
  • Loading branch information
remko48 authored Jan 23, 2024
2 parents 6bc0fcd + 5ba86f8 commit af611e9
Show file tree
Hide file tree
Showing 39 changed files with 2,353 additions and 1,199 deletions.
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
name: Deploy the WOO Page to GitHub Pages
name: Deploy the Waardepapieren Scanner to GitHub Pages

env: # Change these to your preferences any image url can also be a base encoded image
GITHUB_PAGES_BRANCH: gh-pages
Expand All @@ -10,31 +10,28 @@ env: # Change these to your preferences any image url can also be a base encoded
API_BASE_URL: "https://api.gateway.commonground.nu/api"
NL_DESIGN_THEME_CLASSNAME: "conduction-theme"
DEV_ENVIRONMENT: "true"
SHOW_ORGANIZATION: "true"
FAVICON_URL: "https://conduction.nl/wp-content/uploads/2021/07/cropped-favicon-32x32.png"
HEADER_LOGO_URL: "https://conduction.nl/wp-content/uploads/2021/07/cropped-conductionlogo-1.png"
JUMBOTRON_IMAGE_URL: "https://www.conduction.nl/wp-content/uploads/2021/07/cropped-Conduction_HOME_0000_afb1-1.png"
FOOTER_LOGO_URL: "true"
FOOTER_LOGO_HREF: "https://conduction.nl/"
FOOTER_CONTENT: "https://raw.githubusercontent.com/ConductionNL/${{github.event.repository.name}}/main/FooterContent.json"
FOOTER_CONTENT_HEADER: "heading-2"
FOOTER_CONTENT: "https://raw.githubusercontent.com/ConductionNL/woo-website-template/main/pwa/src/templates/templateParts/footer/FooterContent.json"
FOOTER_CONTENT_HEADER: "heading-3"
# OIDN_NUMBER: " "
ENV_VARS_SET: "true"

on:
push:
branches:
- never
- development

jobs:
build:
runs-on: ubuntu-latest

steps:
- name: Get the WOO Website Template Code
- name: Get the Waardepapieren Scan App Code
uses: actions/checkout@v2
with:
repository: ConductionNL/woo-website-template
repository: ConductionNL/waardepapieren-scan-app
ref: development

# With special thanxs to https://github.com/SpicyPizza/create-envfile
Expand All @@ -46,10 +43,7 @@ jobs:
envkey_GATSBY_API_BASE_URL: ${{ env.API_BASE_URL }}
envkey_GATSBY_NL_DESIGN_THEME_CLASSNAME: ${{ env.NL_DESIGN_THEME_CLASSNAME }}
envkey_GATSBY_DEV_ENVIRONMENT: ${{ env.DEV_ENVIRONMENT }}
envkey_GATSBY_SHOW_ORGANIZATION: ${{ env.SHOW_ORGANIZATION }}
envkey_GATSBY_FAVICON_URL: ${{ env.FAVICON_URL }}
envkey_GATSBY_HEADER_LOGO_URL: ${{ env.HEADER_LOGO_URL }}
envkey_GATSBY_JUMBOTRON_IMAGE_URL: ${{ env.JUMBOTRON_IMAGE_URL }}
envkey_GATSBY_FOOTER_LOGO_URL: ${{ env.FOOTER_LOGO_URL }}
envkey_GATSBY_FOOTER_LOGO_HREF: ${{ env.FOOTER_LOGO_HREF }}
envkey_GATSBY_FOOTER_CONTENT: ${{ env.FOOTER_CONTENT }}
Expand Down
2,854 changes: 1,909 additions & 945 deletions pwa/package-lock.json

Large diffs are not rendered by default.

110 changes: 57 additions & 53 deletions pwa/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,9 @@
"private": true,
"description": "Product Website Template",
"author": "Conduction",
"keywords": ["gatsby"],
"keywords": [
"gatsby"
],
"scripts": {
"develop": "gatsby develop",
"start": "gatsby develop",
Expand All @@ -24,52 +26,53 @@
"dependencies": {
"@conduction/components": "2.2.44",
"@conduction/theme": "1.1.12",
"@fortawesome/fontawesome-svg-core": "^6.5.0",
"@fortawesome/free-brands-svg-icons": "6.5.0",
"@fortawesome/free-regular-svg-icons": "6.5.0",
"@fortawesome/free-solid-svg-icons": "^6.5.0",
"@fortawesome/fontawesome-svg-core": "^6.5.1",
"@fortawesome/free-brands-svg-icons": "6.5.1",
"@fortawesome/free-regular-svg-icons": "6.5.1",
"@fortawesome/free-solid-svg-icons": "^6.5.1",
"@fortawesome/react-fontawesome": "^0.2.0",
"@nl-design-system-unstable/amsterdam-design-tokens": "^1.0.0-alpha.128",
"@nl-design-system-unstable/bodegraven-reeuwijk-design-tokens": "^1.0.0-alpha.121",
"@nl-design-system-unstable/borne-design-tokens": "^1.0.0-alpha.121",
"@nl-design-system-unstable/buren-design-tokens": "^1.0.0-alpha.104",
"@nl-design-system-unstable/demodam-design-tokens": "^1.0.0-alpha.116",
"@nl-design-system-unstable/drechterland-design-tokens": "^1.0.0-alpha.121",
"@nl-design-system-unstable/duiven-design-tokens": "^1.0.0-alpha.121",
"@nl-design-system-unstable/duo-design-tokens": "^1.0.0-alpha.121",
"@nl-design-system-unstable/enkhuizen-design-tokens": "^1.0.0-alpha.121",
"@nl-design-system-unstable/groningen-design-tokens": "^1.0.0-alpha.121",
"@nl-design-system-unstable/haarlem-design-tokens": "^1.0.0-alpha.128",
"@nl-design-system-unstable/haarlemmermeer-design-tokens": "^1.0.0-alpha.121",
"@nl-design-system-unstable/hoorn-design-tokens": "^1.0.0-alpha.117",
"@nl-design-system-unstable/horstaandemaas-design-tokens": "^1.0.0-alpha.121",
"@nl-design-system-unstable/leidschendam-voorburg-design-tokens": "^1.0.0-alpha.121",
"@nl-design-system-unstable/nijmegen-design-tokens": "^1.0.0-alpha.116",
"@nl-design-system-unstable/noordoostpolder-design-tokens": "^1.0.0-alpha.121",
"@nl-design-system-unstable/provincie-zuid-holland-design-tokens": "^1.0.0-alpha.121",
"@nl-design-system-unstable/amsterdam-design-tokens": "^1.0.0-alpha.145",
"@nl-design-system-unstable/bodegraven-reeuwijk-design-tokens": "^1.0.0-alpha.138",
"@nl-design-system-unstable/borne-design-tokens": "^1.0.0-alpha.138",
"@nl-design-system-unstable/buren-design-tokens": "^1.0.0-alpha.121",
"@nl-design-system-unstable/demodam-design-tokens": "^1.0.0-alpha.133",
"@nl-design-system-unstable/drechterland-design-tokens": "^1.0.0-alpha.138",
"@nl-design-system-unstable/duiven-design-tokens": "^1.0.0-alpha.138",
"@nl-design-system-unstable/duo-design-tokens": "^1.0.0-alpha.138",
"@nl-design-system-unstable/enkhuizen-design-tokens": "^1.0.0-alpha.138",
"@nl-design-system-unstable/groningen-design-tokens": "^1.0.0-alpha.138",
"@nl-design-system-unstable/haarlem-design-tokens": "^1.0.0-alpha.145",
"@nl-design-system-unstable/haarlemmermeer-design-tokens": "^1.0.0-alpha.138",
"@nl-design-system-unstable/hoorn-design-tokens": "^1.0.0-alpha.134",
"@nl-design-system-unstable/horstaandemaas-design-tokens": "^1.0.0-alpha.138",
"@nl-design-system-unstable/leidschendam-voorburg-design-tokens": "^1.0.0-alpha.138",
"@nl-design-system-unstable/nijmegen-design-tokens": "^1.0.0-alpha.133",
"@nl-design-system-unstable/noordoostpolder-design-tokens": "^1.0.0-alpha.138",
"@nl-design-system-unstable/provincie-zuid-holland-design-tokens": "^1.0.0-alpha.138",
"@nl-design-system-unstable/rotterdam-design-tokens": "^1.0.0-alpha.121",
"@nl-design-system-unstable/stedebroec-design-tokens": "^1.0.0-alpha.121",
"@nl-design-system-unstable/tilburg-design-tokens": "^1.0.0-alpha.121",
"@nl-design-system-unstable/venray-design-tokens": "^1.0.0-alpha.121",
"@nl-design-system-unstable/vught-design-tokens": "^1.0.0-alpha.121",
"@nl-design-system-unstable/westervoort-design-tokens": "^1.0.0-alpha.121",
"@nl-design-system-unstable/zevenaar-design-tokens": "^1.0.0-alpha.121",
"@nl-design-system-unstable/zwolle-design-tokens": "^1.0.0-alpha.121",
"@tabler/icons-react": "2.42.0",
"@types/qs": "^6.9.10",
"@types/react": "^18.2.39",
"@types/react-dom": "^18.2.17",
"@nl-design-system-unstable/stedebroec-design-tokens": "^1.0.0-alpha.138",
"@nl-design-system-unstable/tilburg-design-tokens": "^1.0.0-alpha.138",
"@nl-design-system-unstable/venray-design-tokens": "^1.0.0-alpha.138",
"@nl-design-system-unstable/vught-design-tokens": "^1.0.0-alpha.138",
"@nl-design-system-unstable/westervoort-design-tokens": "^1.0.0-alpha.138",
"@nl-design-system-unstable/zevenaar-design-tokens": "^1.0.0-alpha.138",
"@nl-design-system-unstable/zwolle-design-tokens": "^1.0.0-alpha.138",
"@tabler/icons-react": "2.46.0",
"@types/qs": "^6.9.11",
"@types/react": "^18.2.48",
"@types/react-dom": "^18.2.18",
"@utrecht/component-library-react": "^2.0.0",
"@utrecht/design-tokens": "^1.0.0-alpha.607",
"axios": "^1.6.2",
"clsx": "^2.0.0",
"@utrecht/design-tokens": "^1.0.0-alpha.623",
"axios": "^1.6.5",
"clsx": "^2.1.0",
"dateformat": "^5.0.3",
"dedent": "^1.5.1",
"gatsby": "^5.12.11",
"gatsby": "^5.13.1",
"gatsby-plugin-breadcrumb": "^12.3.2",
"gatsby-plugin-layout": "^4.12.0",
"html-react-parser": "^5.0.6",
"i18next": "^23.7.7",
"gatsby-plugin-layout": "^4.13.0",
"html-react-parser": "^5.1.1",
"i18next": "^23.7.18",
"jose": "^5.2.0",
"jwt-decode": "^4.0.0",
"lodash": "^4.17.21",
"qs": "^6.11.2",
Expand All @@ -78,32 +81,33 @@
"react-dom": "^18.2.0",
"react-favicon": "^2.0.3",
"react-helmet": "^6.1.0",
"react-hook-form": "7.48.2",
"react-hook-form": "7.49.3",
"react-hot-toast": "^2.4.1",
"react-i18next": "^13.5.0",
"react-loading-skeleton": "^3.3.1",
"react-paginate": "^8.2.0",
"react-qr-reader": "^3.0.0-beta-1",
"react-query": "^3.39.3",
"react-select": "^5.8.0",
"showdown": "^2.1.0"
},
"devDependencies": {
"@parcel/watcher": "^2.3.0",
"@parcel/watcher": "^2.4.0",
"@types/dateformat": "^5.0.2",
"@types/dedent": "^0.7.2",
"@types/node": "^20.10.0",
"@types/react-helmet": "^6.1.9",
"@typescript-eslint/eslint-plugin": "^6.13.1",
"@typescript-eslint/parser": "^6.13.1",
"@types/node": "^20.11.5",
"@types/react-helmet": "^6.1.11",
"@types/showdown": "2.0.6",
"eslint": "^8.54.0",
"eslint-config-prettier": "^9.0.0",
"@typescript-eslint/eslint-plugin": "^6.19.0",
"@typescript-eslint/parser": "^6.19.0",
"eslint": "^8.56.0",
"eslint-config-prettier": "^9.1.0",
"eslint-plugin-react": "^7.33.2",
"gh-pages": "^6.1.0",
"gh-pages": "^6.1.1",
"husky": "^8.0.3",
"lint-staged": "^15.1.0",
"lint-staged": "^15.2.0",
"npm-run-all": "^4.1.5",
"prettier": "^3.1.0",
"typescript": "^5.3.2"
"prettier": "^3.2.4",
"typescript": "^5.3.3"
}
}
4 changes: 0 additions & 4 deletions pwa/src/hooks/useEnvironment.ts
Original file line number Diff line number Diff line change
Expand Up @@ -32,12 +32,10 @@ export const useEnvironment = () => {
);
window.sessionStorage.setItem("NL_DESIGN_THEME_CLASSNAME", process.env.GATSBY_NL_DESIGN_THEME_CLASSNAME ?? "");
window.sessionStorage.setItem("FAVICON_URL", process.env.GATSBY_FAVICON_URL ?? "");
window.sessionStorage.setItem("JUMBOTRON_IMAGE_URL", process.env.GATSBY_JUMBOTRON_IMAGE_URL ?? "");
window.sessionStorage.setItem("FOOTER_LOGO_HREF", process.env.GATSBY_FOOTER_LOGO_HREF ?? "");
window.sessionStorage.setItem("FOOTER_CONTENT", process.env.GATSBY_FOOTER_CONTENT ?? "");
window.sessionStorage.setItem("FOOTER_CONTENT_HEADER", process.env.GATSBY_FOOTER_CONTENT_HEADER ?? "");
window.sessionStorage.setItem("OIDN_NUMBER", process.env.GATSBY_OIDN_NUMBER ?? "");
window.sessionStorage.setItem("SHOW_ORGANIZATION", process.env.GATSBY_SHOW_ORGANIZATION ?? "");

updateSessionStorage();
};
Expand All @@ -56,12 +54,10 @@ export const useEnvironment = () => {
);
window.sessionStorage.setItem("NL_DESIGN_THEME_CLASSNAME", config.GATSBY_NL_DESIGN_THEME_CLASSNAME ?? "");
window.sessionStorage.setItem("FAVICON_URL", config.GATSBY_FAVICON_URL ?? "");
window.sessionStorage.setItem("JUMBOTRON_IMAGE_URL", config.GATSBY_JUMBOTRON_IMAGE_URL ?? "");
window.sessionStorage.setItem("FOOTER_LOGO_HREF", config.GATSBY_FOOTER_LOGO_HREF ?? "");
window.sessionStorage.setItem("FOOTER_CONTENT", config.GATSBY_FOOTER_CONTENT ?? "");
window.sessionStorage.setItem("FOOTER_CONTENT_HEADER", config.GATSBY_FOOTER_CONTENT_HEADER ?? "");
window.sessionStorage.setItem("OIDN_NUMBER", config.GATSBY_OIDN_NUMBER ?? "");
window.sessionStorage.setItem("SHOW_ORGANIZATION", config.GATSBY_SHOW_ORGANIZATION ?? "");

updateSessionStorage();
};
Expand Down
8 changes: 1 addition & 7 deletions pwa/src/layout/Head.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,18 +2,12 @@ import * as React from "react";
import _ from "lodash";
import "../styling/index.css";
import { Helmet } from "react-helmet";
import { useGatsbyContext } from "../context/gatsby";
import { useTranslation } from "react-i18next";
import { languageOptions } from "../data/languageOptions";

export const Head: React.FC = () => {
const { gatsbyContext } = useGatsbyContext();
const { t, i18n } = useTranslation();
const { i18n } = useTranslation();

const translatedCrumbs = gatsbyContext.pageContext?.breadcrumb.crumbs.map((crumb: any) => ({
...crumb,
crumbLabel: t(_.upperFirst(crumb.crumbLabel)),
}));

const currentLanguage = languageOptions.find(
(language) => language.label === (i18n.language.toUpperCase() === "EN" ? "US" : i18n.language.toUpperCase()),
Expand Down
3 changes: 3 additions & 0 deletions pwa/src/pages/[id]/index.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
import ResultPage from "./resultPage";

export default ResultPage;
9 changes: 9 additions & 0 deletions pwa/src/pages/[id]/resultPage.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
import * as React from "react";
import _ from "lodash";
import { PageProps } from "gatsby";
import { ResultTemplate } from "../../templates/resultTemplate/ResultTemplate";

const ResultPage: React.FC<PageProps> = (props: PageProps) => {
return <ResultTemplate id={props.params.id} />;
};
export default ResultPage;
24 changes: 23 additions & 1 deletion pwa/src/templates/landing/LandingTemplate.tsx
Original file line number Diff line number Diff line change
@@ -1,12 +1,34 @@
import * as React from "react";
import * as styles from "./LandingTemplate.module.css";
import Skeleton from "react-loading-skeleton";
import { Page, PageContent } from "@utrecht/component-library-react/dist/css-module";
import { QrReader } from "react-qr-reader";
import { navigate } from "gatsby";

export const LandingTemplate: React.FC = () => {
const [data, setData] = React.useState<boolean>(false);

return (
<Page>
<PageContent className={styles.container}>
<span>Hello World!</span>
{!data && (
<QrReader
onResult={(result, error) => {
if (!!result) {
setData(true);
const qrData: any = result;
navigate(`/${qrData.text}`);
}
}}
constraints={{ facingMode: "environment" }}
/>
)}

{data && (
<>
<span>Redirecting</span> <Skeleton height="200px" />
</>
)}
</PageContent>
</Page>
);
Expand Down
88 changes: 88 additions & 0 deletions pwa/src/templates/resultTemplate/ResultTemplate.module.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,88 @@
.container {
margin-block-start: var(--utrecht-space-block-lg) !important;
}

.container > *:not(:last-child) {
margin-block-end: var(--utrecht-space-block-2xl);
}

.cardContainer,
.cardContainer:hover {
gap: 14px;
display: flex;
flex-direction: column;
}

.cardContainer:hover {
cursor: default;
}

.cardContainer:hover .cardHeader {
border-bottom-color: var(--conduction-card-header-hover-border-bottom-color);
}

.success {
--conduction-card-wrapper-background-color: var(
--utrecht-alert-ok-background-color
);
}
.succes:hover {
--conduction-card-wrapper-hover-background-color: var(
--utrecht-alert-ok-background-color
);
}

.fail {
--conduction-card-wrapper-background-color: var(
--utrecht-alert-error-background-color
);
}
.fail:hover {
--conduction-card-wrapper-hover-background-color: var(
--utrecht-alert-error-background-color
);
}

.titleSuccess,
.titleFail {
white-space: nowrap;
}

.titleSuccess > * {
--conduction-card-header-title-color: var(--utrecht-alert-ok-color);
}

.titleFail > * {
--conduction-card-header-title-color: var(--utrecht-alert-error-color);
}

.icon {
margin-inline-end: 10px;
}

.descriptionSuccess {
color: var(--utrecht-alert-ok-color) !important;
}

.descriptionFail {
color: var(--utrecht-alert-error-color) !important;
}

.code {
color: #e2386d;
background-color: #f6f6f6;
padding: 5px;
border: 2px solid #dedede;
border-radius: 5px;
}

@media only screen and (min-width: 992px) {
/* Desktop */
.container {
margin-block-start: var(--utrecht-space-block-3xl);
}

.container > *:not(:last-child) {
margin-block-end: var(--utrecht-space-block-lg);
}
}
Loading

0 comments on commit af611e9

Please sign in to comment.