Merge pull request #143 from YaswanthNagarjuna/telecom/ES-278

[ES-284] New UI for the telecom cross border

mock-relying-party-ui-telecom/.env

@@ -0,0 +1,3 @@
+
+REACT_APP_TOAST_TIMEOUT_IN_SEC=5
+REACT_APP_DEFAULT_LANGUAGE="en"

mock-relying-party-ui-telecom/.env.development

@@ -0,0 +1 @@
+REACT_APP_MOCK_RELYING_PARTY_SERVER_URL=http://localhost:8888

mock-relying-party-ui-telecom/.gitignore

@@ -0,0 +1,104 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+lerna-debug.log*
+
+# Diagnostic reports (https://nodejs.org/api/report.html)
+report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
+
+# Runtime data
+pids
+*.pid
+*.seed
+*.pid.lock
+
+# Directory for instrumented libs generated by jscoverage/JSCover
+lib-cov
+
+# Coverage directory used by tools like istanbul
+coverage
+*.lcov
+
+# nyc test coverage
+.nyc_output
+
+# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
+.grunt
+
+# Bower dependency directory (https://bower.io/)
+bower_components
+
+# node-waf configuration
+.lock-wscript
+
+# Compiled binary addons (https://nodejs.org/api/addons.html)
+build/Release
+
+# Dependency directories
+node_modules/
+jspm_packages/
+
+# TypeScript v1 declaration files
+typings/
+
+# TypeScript cache
+*.tsbuildinfo
+
+# Optional npm cache directory
+.npm
+
+# Optional eslint cache
+.eslintcache
+
+# Microbundle cache
+.rpt2_cache/
+.rts2_cache_cjs/
+.rts2_cache_es/
+.rts2_cache_umd/
+
+# Optional REPL history
+.node_repl_history
+
+# Output of 'npm pack'
+*.tgz
+
+# Yarn Integrity file
+.yarn-integrity
+
+# dotenv environment variables file
+.env.test
+
+# parcel-bundler cache (https://parceljs.org/)
+.cache
+
+# Next.js build output
+.next
+
+# Nuxt.js build / generate output
+.nuxt
+dist
+
+# Gatsby files
+.cache/
+# Comment in the public line in if your project uses Gatsby and *not* Next.js
+# https://nextjs.org/blog/next-9-1#public-directory-support
+# public
+
+# vuepress build output
+.vuepress/dist
+
+# Serverless directories
+.serverless/
+
+# FuseBox cache
+.fusebox/
+
+# DynamoDB Local files
+.dynamodb/
+
+# TernJS port file
+.tern-port
+.env.development.local

mock-relying-party-ui-telecom/Dockerfile

@@ -0,0 +1,117 @@
+FROM node:12.18.4-alpine as build
+
+# Set a build-time environment variable
+ARG mockRpUIPublicUrl
+ARG esignet_ui_base_url
+ARG mock_relying_party_server_url
+ARG redirect_uri
+ARG redirect_uri_registration
+ARG client_id
+ARG acrs
+ARG sign_in_button_plugin_url
+ARG display
+ARG prompt
+ARG grant_type
+ARG max_age
+ARG claims_locales
+ARG scope_user_profile
+
+ENV ESIGNET_UI_BASE_URL=$esignet_ui_base_url
+ENV MOCK_RELYING_PARTY_SERVER_URL=$mock_relying_party_server_url
+ENV REDIRECT_URI=$redirect_uri
+ENV REDIRECT_URI_REGISTRATION=$redirect_uri_registration
+ENV CLIENT_ID=$client_id
+ENV ACRS=$acrs
+ENV SIGN_IN_BUTTON_PLUGIN_URL=$sign_in_button_plugin_url
+ENV DISPLAY=$display
+ENV PROMPT=$prompt
+ENV GRANT_TYPE=$grant_type
+ENV MAX_AGE=$max_age
+ENV CLAIMS_LOCALES=$claims_locales
+ENV SCOPE_USER_PROFILE=$scope_user_profile
+ENV MOCK_RP_UI_PUBLIC_URL=$mockRpUIPublicUrl
+
+# Set the environment variable as a placeholder for PUBLIC_URL
+ENV PUBLIC_URL=_PUBLIC_URL_
+
+## Mock relying party portal
+WORKDIR ./app
+COPY package*.json ./
+RUN npm install
+COPY . ./
+RUN npm run build
+
+EXPOSE 443
+
+FROM nginx
+
+ARG SOURCE
+ARG COMMIT_HASH
+ARG COMMIT_ID
+ARG BUILD_TIME
+LABEL source=${SOURCE}
+LABEL commit_hash=${COMMIT_HASH}
+LABEL commit_id=${COMMIT_ID}
+LABEL build_time=${BUILD_TIME}
+
+# can be passed during Docker build as build time environment for github branch to pickup configuration from.
+ARG container_user=mosip
+
+# can be passed during Docker build as build time environment for github branch to pickup configuration from.
+ARG container_user_group=mosip
+
+# can be passed during Docker build as build time environment for github branch to pickup configuration from.
+ARG container_user_uid=1001
+
+# can be passed during Docker build as build time environment for github branch to pickup configuration from.
+ARG container_user_gid=1001
+
+# can be passed during Docker build as build time environment for artifactory URL
+ARG artifactory_url
+
+# environment variable to pass artifactory url, at docker runtime
+ENV artifactory_url_env=${artifactory_url}
+
+ENV nginx_dir=/usr/share/nginx
+
+ENV work_dir=${nginx_dir}/html
+
+ENV i18n_path=${work_dir}/locales
+
+# set working directory for the user
+WORKDIR /home/${container_user}
+
+# install packages and create user
+RUN apt-get -y update \
+    && apt-get install -y wget unzip zip \
+    && groupadd -g ${container_user_gid} ${container_user_group} \
+    && useradd -u ${container_user_uid} -g ${container_user_group} -s /bin/sh -m ${container_user} \
+    && mkdir -p /var/run/nginx /var/tmp/nginx ${work_dir}/locales\
+    && chown -R ${container_user}:${container_user} /usr/share/nginx /var/run/nginx /var/tmp/nginx ${work_dir}/locales
+
+ADD configure_start.sh configure_start.sh
+
+RUN chmod +x configure_start.sh
+
+RUN chown ${container_user}:${container_user} configure_start.sh
+
+COPY ./nginx/nginx.conf /etc/nginx/nginx.conf
+
+COPY --from=build /app/build ${work_dir}
+
+RUN echo "ESIGNET_UI_BASE_URL=$ESIGNET_UI_BASE_URL" >> ${work_dir}/env.env && echo "MOCK_RELYING_PARTY_SERVER_URL=$MOCK_RELYING_PARTY_SERVER_URL" >> ${work_dir}/env.env && echo "REDIRECT_URI=$REDIRECT_URI" >> ${work_dir}/env.env && echo "REDIRECT_URI_REGISTRATION=$REDIRECT_URI_REGISTRATION" >> ${work_dir}/env.env && echo "CLIENT_ID=$CLIENT_ID" >> ${work_dir}/env.env && echo "ACRS=$ACRS" >> ${work_dir}/env.env && echo "SIGN_IN_BUTTON_PLUGIN_URL=$SIGN_IN_BUTTON_PLUGIN_URL" >> ${work_dir}/env.env && echo "DISPLAY=$DISPLAY" >> ${work_dir}/env.env && echo "MAX_AGE=$MAX_AGE" >> ${work_dir}/env.env && echo "PROMPT=$PROMPT" >> ${work_dir}/env.env && echo "GRANT_TYPE=$GRANT_TYPE" >> ${work_dir}/env.env && echo "CLAIMS_LOCALES=$CLAIMS_LOCALES" >> ${work_dir}/env.env && echo "SCOPE_USER_PROFILE=$SCOPE_USER_PROFILE" >> ${work_dir}/env.env
+
+# change permissions of file inside working dir
+RUN chown -R ${container_user}:${container_user} ${work_dir}
+
+# select container user for all tasks
+USER ${container_user_uid}:${container_user_gid}
+
+EXPOSE 5000
+
+ENTRYPOINT [ "./configure_start.sh" ]
+
+# Start Nginx server
+CMD echo "starting nginx" ; \
+    nginx ; \
+    sleep infinity

mock-relying-party-ui-telecom/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2022 Modular Open Source Identity Platform
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

mock-relying-party-ui-telecom/README.md

@@ -0,0 +1,69 @@
+# Mock Relying Party UI
+
+This react application is the UI for the mock relying party portal
+
+## Overview
+
+This repository contains the reference implementation of a relying party's website that wants to use [MOSIP's
+This repository contains the reference implementation of a relying party's website that wants to use [MOSIP's Esignet (Identity Provider) services](https://github.com/mosip/esignet) to log in users into its portal.
+
+This portal uses [OpenID specs](https://openid.net/specs/openid-connect-core-1_0.html) to communicate with [MOSIP Esignet Services](https://github.com/mosip/esignet).
+
+This portal contains 2 pages.
+
+1. **Home Page**: This page represents the login screen for the relying party's website. This page includes a button with the text, "Sign in with MOSIP". On the click this button, the user gets redirected to the MOSIP's Esignet Portal. The user now has to authenticate and provide consent to share information from MOSIP to relying party, on the Esignet portal.
+
+2. **User Profile Page**: This page shows the user profile on the relying party's website. On successful authentication and consent approval, the user gets navigated to this page with an Auth Code. This Auth Code would be shared with the relying party's backend service via the `/fetchUserInfo` endpoint. The backend then uses the Auth Code to fetch the access token and user details from MOSIP Esignet services.
+
+## Build & run (for developers)
+
+The application run on PORT=5000 by default.
+
+- Env variables
+
+  - ESIGNET_UI_BASE_URL: MOSIP ESIGNET UI URL (Example:https://esignet.dev.mosip.net/)
+  - MOCK_RELYING_PARTY_SERVER_URL: This will be internally resolved to Mock relying party server by internal nginx (Example:http://esignet.dev.mosip.net/mock-relying-party-server)
+  - REDIRECT_URI: Value that needs to be passed into authorize redirect_uri parameter (Example:https://health-services.com/userprofile)
+  - CLIENT_ID: Relying Party client Id, that is registered with MOSIP (Example:health-services)
+  - ACRS: Value that needs to be passed into authorize acr_values parameter (Example:mosip:esignet:acr:generated-code)
+  - PRIVATE_KEY: Private key corresponding to the public key of registered Relying Party Client
+  - MAX_AGE: Represents the maximum amount of time, in seconds, that a cached resource should be considered fresh or valid before it needs to be revalidated with the origin server.
+  (Example:max_age:21)
+  - DISPLAY: This property specifies how the authorization server should display the authentication and consent page to the end-user.
+  Possible values are page, popup, wap, touch 
+  (Exapmle: display:page)
+  - PROMPT: This property specifies the type of prompt to be used during the authentication flow.
+  (Exapmle: prompt:consent)
+  - GRANT_TYPE: This property specifies the OAuth 2.0 grant type that the client will use to request access tokens. (Example: grant_type: authorization_code)
+  - SIGN_IN_BUTTON_PLUGIN_URL: Sign in button url.
+  - SCOPE_USER_PROFILE: List of scopes that are requested when initiating an authentication request.
+  (Example: scope_user_profile: openid%20profile%20resident-service)
+
+- Build and run Docker for a service:
+
+  ```
+  $ docker build -t <dockerImageName>:<tag> .
+  $ docker run -it -d -p 5000:5000 -e ESIGNET_UI_BASE_URL='http://localhost:3000' -e MOCK_RELYING_PARTY_BASE_URL=http://localhost:8888 -e REDIRECT_URI=http://localhost:5000/userprofile -e CLIENT_ID=healthservices -e ACRS="mosip:esignet:acr:static-code" -e MAX_AGE=21 -e DISPLAY=page -e PROMPT=consent -e GRANT_TYPE=authorization_code -e SIGN_IN_BUTTON_PLUGIN_URL='http://127.0.0.1:5500/dist/iife/index.js' -e SCOPE_USER_PROFILE='openid%20profile%20resident-service' -e PRIVATE_KEY='-----BEGIN PRIVATE KEY-----\nMIIEvQIBADANBgkqhkiG9w0BAQEFAASCBKcwggSjAgEAAoIBAQCoUPbvrrOxtxAt\nR2rCmSrSjZjyvpLklB8wxCqWQJ5wuvw1j7SEvMFds9QeYpomO/GVZNYGbWuBwQEG\nWdBll9ZdI02H5hjNzZi3SFcv+N+OHFh5RHNnkeLtIuA684BJHkJNL19LcQlb+u1G\nWeqyPCk3rdDNPZYBJBcS4i1BF3SF2gW9nsvxS+xOB12l1Dubntfs1AXhSgZvy5oe\nhgJIDhy7BbqJEJPfbcOAQE8GlnjxjSY3Ja0m9YD2MT3V93DSz0OLyLQjnMs+FJQc\nRpFDupHSSa3QerEXwxqHmXyH0RZJmH1oZizdEImdgXRjgfy98a6ZwU2p43WSg1LR\nrIZU+HC7AgMBAAECggEAAnaE1ocI7B3Qp8j2v/g7zy7xQQQW5C9isXT9Zot1hhLG\nZAZBTvvwHG3oObWZqduQsm3yT8/EFfb8C9q+mO363gwJM2bjkAdlJ7FwTSxoIQ07\nIjMlOSvCVVQAUfyEMQ23TKfXziPOTkFCvZfNPmRw+faaKpavHj8n80fJ/7zXIKpE\n/Z7+izLhGmos7LgofZRqxYMcq6RznR7w9FQPsdnspC3EPudrwV+HBAEuqOMfN+Zs\n2bVqKbOz0z8WzQ7K1+bhX93flBqlO3lVNXHK+Oov3DmTG4SIxaim30vM5oijaD+q\nsXYq1r34GRtcEZ26qx3iCdFd5o9sBgA6EMQ8iOWfMQKBgQDUT87IQWNPBBzWoANf\nKR4iR4wc9f4O1uZFnJ5Ec8EBscUvccYErQ3YHxcmycpbLWRijgNnCYsDXVU7uFsm\no7pV1Qn95o8TDHbr+F/mmKq/UMuMjvUmZc93pKMADlsw7aXRHlzuggIH2nAkRUi3\nrCYdmrXWwTyJ8f0cFIlS/EQAaQKBgQDK845NT/ZqOUqJdAq7aoTjC41ER6CFMSxR\nO215g8kaeYbnRlzNcyqxk9PTEEadoHvZyAdYxRfdLU22zE0ImN2Y5Jfi0wRJYT+C\nj3q1sORezw65qB/CKwgMnE9Tiu9fHbrlpeb+lIBEnIFiAoPwOOOMzhXzUxOtlT7r\n/v4Dy3MDgwKBgQCtat7Rba+LTCWuHZeDdBd8Eorc4QV644fFlm8kJJSjKKyS21DO\nYvgq7wI/GZZjMUmMwsj+sanNvr+u/x/dCOFb2J7HuDpnacf9aKwUs+DMUldg4ShX\nC9QRuvW1RwSvi33kuPNZkfHMrlzpE3qZJFEh30vmNYKYfoOrGw8sLIfy+QKBgHGU\nTo478vbNq0YzmBH88fOyslOFFnOT6m5nqMO5miFj47io6yTbkAgjaAeV8z8h4k4m\nIN5wJwPT58smmPH3wwRe4hXB7IM4lnd13sGyBox8qowCaAudU3rjO43QklgT5lXB\nO/47k3FSeSIlsDsPS2GwsB4l3zxk6vreEMCE6pALAoGAZ6vITL4uljwBE3Wv+czJ\nEYiOzmnRLK3TwcNx2E1i4gLi8Fj2NUtXAU2BXEa9oW8Zh+b95X0GjgLJamjZi1cH\nU9ByKn/LBzASbvK5q2fLEsOWWigAUKfO6ecmc8MVniS4GJ+WGsUHcsC3usO4clm0\nWxOiTQVUZ7xZxXwy6DOFLFg=\n-----END PRIVATE KEY-----' <dockerImageName>:<tag>
+  ```
+
+  To host mock relying party ui on a context path:
+  1. Remove the location path with `/` in the nignx file and add the location with context path as below.
+    ```
+    location /healthservices {
+       alias /usr/share/nginx/healthservices;
+       try_files $uri $uri/ /healthservices/index.html;
+    }
+    ```
+  2. Provide the context path in the env variable `MOCK_RP_UI_PUBLIC_URL` during docker run.
+  ```
+  $ docker build -t <dockerImageName>:<tag> .
+  $ docker run -it -d -p 3000:3000 -e MOCK_RP_UI_PUBLIC_URL='healthservices' <dockerImageName>:<tag>
+
+  # The UI will be hosted on http://<domain>/healthservices
+  ```
+
+- Build and run on local system:
+  Update "/mock-relying-party-ui/public/env-config.js" file according to the requirements
+  ```
+  $ npm start
+  ```

mock-relying-party-ui-telecom/configure_start.sh

@@ -0,0 +1,41 @@
+#!/bin/bash
+
+#installs the pre-requisites.
+set -e
+
+echo "Downloading pre-requisites install scripts"
+wget --no-check-certificate --no-cache --no-cookies $artifactory_url_env/artifactory/libs-release-local/i18n/mock-relying-party-i18n-bundle.zip -O $i18n_path/mock-relying-party-i18n-bundle.zip
+
+echo "unzip pre-requisites.."
+chmod 775 $i18n_path/*
+
+cd $i18n_path
+unzip -o mock-relying-party-i18n-bundle.zip
+
+echo "unzip pre-requisites completed."
+
+echo "Replacing public url placeholder with public url"
+
+workingDir=$nginx_dir/html
+if [ -z "$MOCK_RP_UI_PUBLIC_URL" ]; then
+  rpCmd="s/_PUBLIC_URL_//g"
+  grep -rl '_PUBLIC_URL_' $workingDir | xargs sed -i $rpCmd
+else
+  workingDir=$nginx_dir/${MOCK_RP_UI_PUBLIC_URL}
+  mkdir $workingDir
+  mv  -v $nginx_dir/html/* $workingDir/
+  rpCmd="s/_PUBLIC_URL_/\/${MOCK_RP_UI_PUBLIC_URL}/g"
+  grep -rl '_PUBLIC_URL_' $workingDir | xargs sed -i $rpCmd
+fi
+
+echo "Replacing completed."
+
+echo "generating env-config file"
+
+echo "window._env_ = {" > ${workingDir}/env-config.js
+awk -F '=' '{ print $1 ": \"" (ENVIRON[$1] ? ENVIRON[$1] : $2) "\"," }' ${workingDir}/env.env >> ${workingDir}/env-config.js
+echo "}" >> ${workingDir}/env-config.js
+
+echo "generation of env-config file completed!"
+
+exec "$@"