Git Product home page Git Product logo

corona-warn-app / cwa-event-landingpage Goto Github PK

View Code? Open in Web Editor NEW
7.0 14.0 5.0 1.82 MB

Small event landing page for new CWA users when using the native camera. The CWA development ends on May 31, 2023. You still can warn other users until April 30, 2023. More information:

Home Page: https://coronawarn.app/en/faq/#ramp_down

License: Apache License 2.0

CSS 0.59% HTML 5.61% JavaScript 4.70% SCSS 88.86% Dockerfile 0.23%

cwa-event-landingpage's Introduction


About this RepositoryDevelopmentDocumentationSupport and FeedbackHow to contributeLicensingEvent landing page WebsiteRapid antigen test landing page Website


Corona-Warn-App: Landing page

About this Repository

This repository contains the source files of the official Corona-Warn-App landing page as it is available at e.coronawarn.app (for event-registration),s.coronawarn.app (for rapid antigen tests) & p.coronawarn.app (for rapid PCR tests). The page opens for first-time users who have not installed the CWA app after scanning a check-in QR code or a QR code for a rapid antigen/PCR test result with a native camera app. The page also opens for users who clicked a link on an external website and the browser does not redirect to the CWA. This might be due to preference settings of the browser app and/or OS settings. For information about the project, please see our documentation repository.

Development

Requirements

You need the LTS version of Node.js (which includes npm) to build the website. Optionally, you need an HTTP Server such as http-server to run and test the deployment of the website locally.

Getting started

Clone the repository and ensure to have all requirements installed. To build the website, switch to the cwa-event-landingpage base directory and execute the commands

npm install
npm run build

After a successful build, you'll have a new folder public in the repository's base directory. It contains the generated files for the complete website.

To test the generated content, simply execute the command

npm start

It will automatically use public as base directory and watch for file changes. Go to localhost:8000 to view the website.

Updating the landing page

Pull Requests can be opened here on GitHub and will be merged into the main branch. Deployment of changes to e.coronawarn.app (for event-registration), p.coronawarn.app and s.coronawarn.app is done manually. Thus, even if a PR is merged into main here on GitHub, changes are not immediately visible on the pages, but only after the changes have been deployed.

Documentation

The full documentation for the Corona-Warn-App can be found in the cwa-documentation repository. The documentation repository contains technical documents, architecture information, and white papers related to this implementation.

Support and Feedback

The following channels are available for discussions, feedback, and support requests:

Type Channel
General discussion, issues, bugs
Other requests

How to contribute

The German government has asked SAP and Deutsche Telekom AG to develop the Corona-Warn-App for Germany as open source software. Deutsche Telekom is providing the network and mobile technology and will operate and run the backend for the app in a safe, scalable and stable manner. SAP is responsible for the app development, its framework and the underlying platform. Therefore, development teams of SAP and Deutsche Telekom are contributing to this project. At the same time our commitment to open source means that we are enabling -in fact encouraging- all interested parties to contribute and become part of its developer community.

For more information about how to contribute, the project structure, as well as additional contribution information, see our Contribution Guidelines. By participating in this project, you agree to abide by its Code of Conduct at all times.

Repositories

A list of all public repositories from the Corona-Warn-App can be found here.

Licensing

Copyright (c) 2020-2023 Deutsche Telekom AG and SAP SE or an SAP affiliate company.

Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License.

You may obtain a copy of the License at https://www.apache.org/licenses/LICENSE-2.0.

Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the LICENSE for the specific language governing permissions and limitations under the License.

The "Corona-Warn-App" logo is a registered trademark of The Press and Information Office of the Federal Government. For more information please see bundesregierung.de.

cwa-event-landingpage's People

Contributors

brianebeling avatar christianneu avatar dependabot[bot] avatar dervogel2020 avatar dsarkar avatar ein-tim avatar hilmarf avatar larswmh avatar mikemcc399 avatar svengabr avatar thomasaugsten avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

cwa-event-landingpage's Issues

Logo should redirect to coronawarn.app

Feature description

When clicking on the logo in the top left corner or in the footer it would be nice if the main page www.coronawarn.app would be opened.

Problem and motivation

Users who want to find out more about the Corona-Warn-App maybe return to this page while waiting for their download to be finished. Then it would be nice if they could directly go to the main page via the logo.

Is this something you're interested in working on

I'd like to but not sure yet wether I'm able to.

Deployment request

I request a deployment of the code base of this repository to the actual production environment, after the following actions have been performed

  • PR #67 has been merged
  • Issue #68 has been fixed

Applinks will not work if the server side file is missing.

Problem with Applinks and Rapid-Tests

I really want to add a button on the booking page for adding a rapid test to the CWA. This is important if someone is booking the test online with its smartphone. He usually cannot print the code and scan it afterwards with the CWA.
But clicking on the link opens the Appstore and not the app.

Avoid duplicates

  • Bug is not mentioned in the FAQ
  • Bug is specific for iOS only, for general issues / questions that apply to iOS and Android please raise them in the documentation repository
  • Bug is not already reported in another issue

Technical details

  • Device name: All
  • iOS version: 14.5.1
  • App version: 2.2.1

Describe the bug

The application seems to correctly define the following domain s.coronawarn.app as Accociated Domain. But unfortunately this will not work until there is no server-side file called apple-app-site-association accessible via https://s.coronawarn.app/apple-app-site-association. I'm not sure why this is missing. It might be on purpose (due to a bug in the app) or by mistake. I don't know, but it should be fixed asap as it breaks the user experience if you receive the QR-Code on your mobile device.

Steps to reproduce the issue

Please use a QR-Code and extract the URL out of it. Open the URL in the Browser.
Current behavior: The Appstore opens ...

Expected behaviour

CWA should open and import the rapid test data.

Possible Fix

Add the required file apple-app-site-association on the web-site that is used for s.coronawarn.app. That's it.
I don't know whether the app is capable of loading the data. But the code looks capable of doing so.

Additional context

Our test center does not allow bookings on site. We expect that bookings will be done by the costomer online. Therefore we do not provide the QR-Code when the user enters the test center. We provide the QR-Code via mail if the test result is uploaded to the CWA-Backend. Users of mobile phone currently have to print the QR-Code and scan it afterwards what is a big bummer.


Internal Tracking ID: EXPOSUREAPP-7379
Internal Tracking ID: EXPOSUREAPP-7359

Build instructions and compatibility with Node.js 18 LTS

Where to find the issue

https://github.com/corona-warn-app/cwa-event-landingpage

Describe the issue

README - Requirements says:

"You need the LTS version of Node.js (which includes npm) to build the website."

followed by the instructions to execute the commands:

npm install
npm run build

18.12.0 LTS is the version displayed on the main page of https://nodejs.org/en/ which is the Active LTS version.

14.20.1 is classed as Maintenance according to https://nodejs.org/en/about/releases/.

Executing npm install using the active node LTS version 18 outputs the following message and causes the local version of package-lock.json to become out of sync with the git-managed file package-lock.json in the repository on the GitHub server:

npm WARN old lockfile
npm WARN old lockfile The package-lock.json file was created with an old version of npm,
npm WARN old lockfile so supplemental metadata must be fetched from the registry.
npm WARN old lockfile
npm WARN old lockfile This is a one-time fix-up, please be patient...
npm WARN old lockfile

Steps to reproduce

In cloned branch main of https://github.com/corona-warn-app/cwa-event-landingpage:

  1. nvm use lts/*
  2. npm install
  3. git status
    shows
    modified: package-lock.json

Suggested change

  1. Update the README description to recommend using the Node.js 14 Maintenance version instead of the Active LTS version 18.

and possibily:

  1. Update the repository https://github.com/corona-warn-app/cwa-event-landingpage to use Node.js 16 in alignment with other repositories:


Internal Tracking ID: EXPOSUREAPP-11893

Scan event QR code with Firefox scanner gives error

Technical details

  • Device: Samsung Galaxy A52 5G SM-A526B/DS
  • Android version: 12
  • App version: 2.17.2
  • Firefox version: 97.1.0

The Firefox issue is reproducible on other Android versions, such as Android 8.0 as well.

Describe the issue

Firefox's built-in QR code scanner fails to transfer a CWA event QR code to the CWA app. This seems to be a limitation of Firefox, not a bug in CWA.

If CWA is installed and there is internet connectivity then scanning an event QR code using the built-in Firefox scanner first results in a compatibility error message "Your browser is not compatible" followed by "Invalid QR Code ... Invalid URI - no matchedDescriptor".

I only could get the Firefox scan option to work under the following conditions:

  • flight mode enabled
  • Firefox settings > Delete browsing data > Cached images and files are deleted from any previous attempts
  • use Firefox "Open in app" menu option

Steps to reproduce

  1. Install CWA Android
  2. Open CWA, tap "CREATE QR CODE", tap "+ QR CODE", select "Workplace", enter a Description and a Place, tap SAVE
  3. Tap three-dot menu symbol, select "Display Print Version"
  4. Save print version (for instance using share and Google Drive)
  5. Display print version of event code by printing out or displaying on another device
  6. Install Mozilla Firefox on Android
  7. Open Firefox, tap on three-dot menu symbol, tap Settings, enable "Open links in apps"
  8. Tap in search field
  9. Tap "Scan" and point at displayed event code
  10. Firefox displays "Allow Firefox to open https://e.coronawarn.app?v=1#xxxxxxxx"

Firefox allow

  1. Tap "ALLOW"
  2. e.coronawarn.app/en displays "Your browser is not compatible"

Firefox not compatible

  1. Tap Firefox three-dot symbol, tap "Open in app"

Firefox open in app

  1. CWA opens and displays error "Invalid QR Code ... Invalid URI - no matchedDescriptor"

CWA invalid qr code

Workarounds

Scan a CWA event code using ...

  1. the built-in scanner of the Corona-Warn-App.
  2. the camera app of Android if this has QR code recognition capability
  3. the built-in QR code scanner of your Android device, if available
  4. a third-party QR code scanner.

Make it possible to edit the content of s.coronawarn.app independent of e.coronawarn.app

Feature description

Currently, the sites https://e.coronawarn.app (for the event-registration) and https://s.coronawarn.app (for RAT) can't be edited independently according to @thomasaugsten in corona-warn-app/cwa-documentation#603 (comment). It should be possible to edit the content of only https://s.coronawarn.app and not of https://e.coronawarn.app and vice versa.

Problem and motivation

Currently, https://s.coronawarn.app shows exactly the same as https://e.coronawarn.app.
This could lead to confusing if somebody scanned a QR-Code or clicked on a link from a RAT and then sees "Download the Corona-Warn-App to check in." although he/she only wanted to get his test result for the RAT. (See also corona-warn-app/cwa-documentation#603 (comment))

Is this something you're interested in working on

After it's possible to edit https://e.coronawarn.app and https://s.coronawarn.app independently of each other, I can provide texts for https://s.coronawarn.app.

redirect http to https

Where to find the issue

http://e.coronawarn.app

Describe the issue

If you, for any reason, enter the URI in a browser manually without "https:", the server does not respond.

Suggested change

Redirect requests from http to https.

But actually I also wanted to tell hi to @svengabr ! I didn't hear from you for a while, and it's nice to find you here still full of activity. Hope you're fine!

Change from #30 was not deployed

Where to find the issue

EN: https://e.coronawarn.app/en/
DE: https://e.coronawarn.app/de/

Describe the issue

It seems like the change I did in #30 was never deployed to e.coronawarn.app or s.coronawarn.app.

Suggested change

The README says:


Updating the landing page

Any direct commits and merged pull requests will automatically trigger follow-up actions to build and deploy the changes to e.coronawarn.app and s.coronawarn.app. The respective GitHub Actions are available in the .github/workflows directory of this repository.


This seems to be either out of date or was never true, as in https://github.com/corona-warn-app/cwa-event-landingpage/actions I can only find the Build Page workflow, which is only the GitHub action for the check which runs on every commit in this repo. It is, however, not the workflow deploying the changes.

So I suggest to add a workflow, similar to the one which can be found in the https://github.com/corona-warn-app/cwa-website repository, which deploys the changes merged into main here, to the PROD server.

cc @dsarkar @thomasaugsten & @christianneu

Plans for this site?

Is there any information about the plans for this site?

The site only displays if the user does not already have CWA installed and then its primary purpose is to prompt the user to install the app.

The site was manually cloned from https://github.com/corona-warn-app/cwa-website, stripped down in functionality, then modified to provide the needed functionality.

Issues

Suggestion

  1. Clarify if it is necessary to keep the site up-to-date with the main production URL https://www.coronawarn.app/
  2. If yes then:
  3. Automate deployment
  4. Manually add necessary PRs from https://github.com/corona-warn-app/cwa-website to this site, modifying them as required

Literal display of `&shy` in the footer of the page

Where to find the issue

In the footer of the page. Please note that the problem is not visible on the production domains p.coronawarn.app, s.coronawarn.app or e.coronawarn.app, as the faulty change has not been deployed yet. It was introduced with #51. The issue is visible when locally building the page or on my Vercel preview deployment here: https://cwa-event-landingpage.vercel.app/de/

Describe the issue

The page shows a literal display of the HTML attribute &shy, instead of processing it as HTML code and hiding it from the UI.

Suggested change

This problem needs further investigation and fixing. @MikeMcC399 made an educated guess on why this happens in #67 (comment). I'm not qualified enough to further look into this, sorry. However, we could go the simple way and just remove the &shy attribute. If you want to go this way, please let me know and I will provide a PR.


Internal Tracking ID: EXPOSUREAPP-14671

Rapid test registration: Browser not compatible

Where to find the issue

Try to register a rapid test result via a link instead of scanning a QR code, and open the link in Firefox Browser on Android.

Describe the issue

Instead of a successful registration, the website displays a big red text, along with a request to download the Corona-Warn-App:

Your Browser is not compatible. Please open the link in Chrome.

Suggested change

Allow rapid test result registration via other Android browsers (especially Firefox).


Internal Tracking ID: EXPOSUREAPP-7379
Internal Tracking ID: EXPOSUREAPP-7359

Missing social media links for landing pages

Where to find the issue

Describe the issue

The footers of the websites:

are no longer aligned to the footer of the website:

The footers of https://e.coronawarn.app/ and https://s.coronawarn.app/ are missing the:

  1. Link to Social Media https://www.coronawarn.app/en/community/#social-media
  2. Link to Twitter https://twitter.com/coronawarnapp
  3. Link to Instagram https://www.instagram.com/rki_fuer_euch/

Footer of https://e.coronawarn.app/ and https://s.coronawarn.app/

s coronawarn app


Footer of https://www.coronawarn.app/

coronawarn app

Suggested change

Update the footers of the websites:

to display the same as the footer of the website:

including update to the latest Copyright year.

See in particular PR corona-warn-app/cwa-website#2284 "Add social media icons and community section".

App download instructions missing for Firefox

Where to find the issue

https://e.coronawarn.app/en/ Event Landing Page

Describe the issue

The instructions to download the app do not display if an event QR is scanned, CWA is not installed and Firefox is the default browser.

Steps to reproduce issue

  1. On Android 12 install Mozilla Firefox (97.1.0)
  2. If Corona-Warn-App is installed, then uninstall
  3. Set Firefox as default browser
  4. Reset Firefox to default settings, if not new install of Firefox
  5. Open camera and point at QR code
  6. "Web address" appears, tap "Show options", tap "Open in browser"
  7. Firefox opens and shows the following screen

Landing_Firefox_EN

There is a German-language button but no text to suggest that the app needs to be downloaded.

Expected

If CWA is not installed and Firefox is set as the default browser then the same message as is output when Chrome is the default browser should be displayed.

Landing_Chrome_EN

Repeating the above "Steps to reproduce" with Firefox as default browser and CWA already installed allows a successful event check in, so the only missing factor in the original Firefox scenario was that CWA was not installed.

Suggested change

Advise the Firefox user to install CWA or to check that CWA is installed when the Firefox browser is unable to open the app after scanning an event code QR.

Enable Dependabot alerts

It seems that Dependabot alerts are not enabled on this repository, unlike on cwa-website where a lot of the code came from.

Since the npm versions are generally older here than on cwa-website, I would expect to see auto-generated PRs suggested to fix security vulnerabilities, however there are none.

I suggest to enable Dependabot alerts here too (GitHub Settings > Code Security & Analysis).

References to TAN Hotline in footer

Where to find the issue

Footer of all pages on e.coronawarn.app, p.coronawarn.app & s.coronawarn.app "Hotline TAN"

Describe the issue

References to the TAN Hotline in the footer do not say that the hotline will be discontinued.

Suggestion

Remove the "Hotline TAN" paragraph on 01. Feb 2023.

References

coronawarn.app/en/blog/2023-01-18-cwa-3-0 says "... the operation of the verification hotline will be discontinued as of 31.01.2023."

Related issue


Internal Tracking ID: EXPOSUREAPP-14643

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.