Merge pull request #141 from covidpass-org/dev

Dev

Dockerfile

@@ -1,5 +1,5 @@
 # Install dependencies only when needed
-FROM node:14-alpine AS deps
+FROM node:16-alpine AS deps
 # Check https://github.com/nodejs/docker-node/tree/b4117f9333da4138b03a546ec926ef50a31506c3#nodealpine to understand why libc6-compat might be needed.
 RUN apk add --no-cache libc6-compat
 WORKDIR /app
@@ -7,14 +7,14 @@ COPY package.json ./
 RUN yarn install --frozen-lockfile
 
 # Rebuild the source code only when needed
-FROM node:14-alpine AS builder
+FROM node:16-alpine AS builder
 WORKDIR /app
 COPY . .
 COPY --from=deps /app/node_modules ./node_modules
 RUN yarn build
 
 # Production image, copy all the files and run next
-FROM node:14-alpine AS runner
+FROM node:16-alpine AS runner
 WORKDIR /app
 
 ENV NODE_ENV production

components/Button.tsx

@@ -1,18 +1,36 @@
 interface ButtonProps {
   text?: string,
   icon?: string,
-  onClick: () => void,
+  onClick?: () => void,
+  loading?: boolean,
+  type?: ButtonType,
+}
+
+export enum ButtonType {
+    submit = 'submit',
+    button = 'button',
 }
 
 function Button(props: ButtonProps): JSX.Element {
     return (
         <button
-            type="button"
+            type={props.type}
             onClick={props.onClick}
-            className="focus:outline-none h-20 bg-gray-400 dark:bg-gray-600 hover:bg-gray-500 text-white font-semibold rounded-md items-center flex justify-center">
+            className={`${props.type == ButtonType.submit ? "bg-green-600 hover:bg-green-700" : "bg-gray-400 dark:bg-gray-600 hover:bg-gray-500"} relative focus:outline-none h-20 text-white font-semibold rounded-md items-center flex justify-center`}>
             {
                 props.icon && <img src={props.icon} className="w-12 h-12 mr-2 -ml-4" />
             }
+            {
+                props.type == ButtonType.submit &&
+                <div id="spin" className={`${props.loading ? undefined : "hidden"} absolute left-2`}>
+                    <svg className="animate-spin h-5 w-5 ml-4" viewBox="0 0 24 24">
+                        <circle className="opacity-0" cx="12" cy="12" r="10" stroke="currentColor"
+                                strokeWidth="4"/>
+                        <path className="opacity-80" fill="currentColor"
+                            d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"/>
+                    </svg>
+                </div>
+            }
             {props.text}
         </button>
     )

components/Form.tsx

@@ -13,7 +13,7 @@ import {getPayloadBodyFromFile, getPayloadBodyFromQR} from "../src/process";
 import {PassData} from "../src/pass";
 import {COLORS} from "../src/colors";
 import Colors from './Colors';
-import Button from './Button';
+import Button, { ButtonType } from './Button';
 
 function Form(): JSX.Element {
     const {t} = useTranslation(['index', 'errors', 'common']);
@@ -274,19 +274,8 @@ function Form(): JSX.Element {
                                 </Link>.
                             </p>
                         </label>
-                        <div className="flex flex-row items-center justify-start">
-                            <button id="download" type="submit"
-                                    className="focus:outline-none bg-green-600 py-2 px-3 text-white font-semibold rounded-md disabled:bg-gray-400">
-                                {t('index:addToWallet')}
-                            </button>
-                            <div id="spin" className={loading ? undefined : "hidden"}>
-                                <svg className="animate-spin h-5 w-5 ml-4" viewBox="0 0 24 24">
-                                    <circle className="opacity-0" cx="12" cy="12" r="10" stroke="currentColor"
-                                            strokeWidth="4"/>
-                                    <path className="opacity-75" fill="currentColor"
-                                          d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"/>
-                                </svg>
-                            </div>
+                        <div className="grid grid-cols-1">
+                            <Button type={ButtonType.submit} text={t('index:addToWallet')} loading={loading} />
                         </div>
                     </div>
                 }/>

components/Page.tsx

@@ -12,7 +12,7 @@ function Page(props: PageProps): JSX.Element {
     const { t } = useTranslation('common');
 
     return (
-        <div className="md:w-2/3 xl:w-2/5 md:mx-auto flex flex-col min-h-screen justify-center px-5 py-12">
+        <div className="md:w-2/3 xl:w-2/5 md:mx-auto flex flex-col min-h-screen justify-center px-5 pt-12 pb-16">
             <Head>
                 <title>{t('common:title')}</title>
                 <link rel="icon" href="/favicon.ico"/>

next-env.d.ts

@@ -1,3 +1,6 @@
 /// <reference types="next" />
 /// <reference types="next/types/global" />
 /// <reference types="next/image-types/global" />
+
+// NOTE: This file should not be edited
+// see https://nextjs.org/docs/basic-features/typescript for more information.

package.json

@@ -17,7 +17,7 @@
     "do-not-zip": "^1.0.0",
     "file-saver": "^2.0.5",
     "jsqr": "^1.4.0",
-    "next": "12",
+    "next": "^11.1.0",
     "next-i18next": "^8.5.1",
     "next-seo": "^4.26.0",
     "node-fetch": "^2.6.1",

public/locales/sv/common.yml

@@ -1,5 +1,5 @@
 title: CovidPass
-subtitle: Lägg till digitala Covid-certifikat från EU i din favorit­plånboks­app.
+subtitle: Lägg till digitala Covid-certifikat från EU i din favorit plånboks app.
 privacyPolicy: Integritetspolicy
 donate: Sponsra
 gitHub: GitHub

public/locales/sv/privacy.yml

@@ -1,10 +1,10 @@
 gdprNotice: |
-Vår integritetspolicy är baserad på de villkår som används av den europeiska lagstiftaren för verkställandet av den allmänna dataskyddsförordningen (GDPR).
+  Vår integritetspolicy är baserad på de villkår som används av den europeiska lagstiftaren för verkställandet av den allmänna dataskyddsförordningen (GDPR).
 generalInfo: Allmän information
 generalInfoProcess: |
   Hela den process som genererar passfilen sker lokalt i din webbläsare.
   Under signeringen skickas endast en kondenserad motsvarighet av din data till servern.
-generalInfoStoring: Din data sparas inte utanför den aktiva webbläsar­sessionen och sidan använder sig inte av cookies.
+generalInfoStoring: Din data sparas inte utanför den aktiva webbläsar sessionen och sidan använder sig inte av cookies.
 generalInfoThirdParties: Ingen data skickas till tredjeparter.
 generalInfoHttps: Vi överför din data säkert över HTTPS.
 generalInfoLocation: Vår server är baserad i Nürnberg, Tyskland.

src/decode.ts

@@ -20,6 +20,10 @@ export function typedArrayToBuffer(array: Uint8Array): ArrayBuffer {
 }
 
 export function decodeData(data: string): Object {
+    if (data.startsWith('https://')) {
+        var url = new URL(data);
+        data = decodeURIComponent(url.hash.substring(1));
+    }
 
     if (data.startsWith('HC1')) {
         data = data.substring(3);
@@ -45,4 +49,4 @@ export function decodeData(data: string): Object {
     var decoded: Object = cbor.decode(typedArrayToBufferSliced(plaintext));
 
     return decoded;
-}
+}

src/pass.ts

@@ -19,6 +19,7 @@ interface QrCode {
     message: string;
     format: QrFormat;
     messageEncoding: Encoding;
+    altText: string;
 }
 
 interface SignData {
@@ -83,6 +84,7 @@ export class PassData {
             message: payload.rawData,
             format: QrFormat.PKBarcodeFormatQR,
             messageEncoding: Encoding.utf8,
+            altText: 'SCAN TO VERIFY',
         }
 
         // Create pass data

src/payload.ts

@@ -235,7 +235,17 @@ export class Payload {
                     throw new Error('invalidTestType')
                 }
 
-                const testResult = valueSets.testResults[testResultKey].display;
+                let testResult = valueSets.testResults[testResultKey].display;
+
+                switch (testResult) {
+                    case 'Not detected':
+                        testResult = 'Negative';
+                        break;
+                    case 'Detected':
+                        testResult = 'Positive';
+                        break;
+                }
+
                 const testType = valueSets.testTypes[testTypeKey].display;
 
                 const testTime = testDateTimeString.replace(/.*T/, '').replace('Z', ' ') + 'UTC';
@@ -339,6 +349,14 @@ export class Payload {
                 throw new Error('certificateType');
         }
 
+        data.backFields.push(...[
+            {
+                key: "credits",
+                label: "",
+                value: "Created with <a href='https://covidpass.marvinsextro.de'>CovidPass</a>"
+            }
+        ]);
+
         return data;
     }
 }

src/process.ts

@@ -12,7 +12,6 @@ export async function getPayloadBodyFromFile(file: File, color: COLORS): Promise
 
     switch (file.type) {
         case 'application/pdf':
-            console.log('pdf')
             // Read file
             const fileBuffer = await file.arrayBuffer();
             imageData = await getImageDataFromPdf(fileBuffer)
@@ -21,7 +20,6 @@ export async function getPayloadBodyFromFile(file: File, color: COLORS): Promise
         case 'image/jpeg':
         case 'image/webp':
         case 'image/gif':
-            console.log(`image ${file.type}`)
             imageData = await getImageDataFromImage(file)
             break
         default: