Merge pull request #119 from sineverba/release-1.3.0

Release 1.3.0

.circleci/config.yml

@@ -1,23 +1,147 @@
 version: 2.1
+executors:
+  docker_executor:
+    docker:
+      - image: cimg/node:20.12.1
+    resource_class: medium
+    environment:
+      NPM_VERSION: 10.5.1
+  amd64_executor:
+    machine:
+      image: ubuntu-2204:current
+    resource_class: large
+    environment:
+      FOLDER_APP: online-banking-frontend
+      DOCKER_REGISTRY: registry.gitlab.com
+      DOCKER_IMAGE: registry.gitlab.com/cicdprojects/online-banking-frontend
+      NODE_VERSION: 20.12.1
+      NPM_VERSION: 10.5.1
+      NGINX_VERSION: 1.25.4
+      BINFMT_VERSION: qemu-v7.0.0-28
 jobs:
-
   test:
-    docker:
-      - image: cimg/node:20.11.0
-
+    executor: docker_executor
+    steps:
+      - checkout
+      - run:
+          name: "Setup NPM version"
+          command: npm install npm@$NPM_VERSION
+      - run:
+          name: "Setup project"
+          command: npm ci
+      - run:
+          name: "Add .env file"
+          command: cp .env.bak .env
+      - run:
+          name: "Run test"
+          command: npx jest
+      - store_test_results:
+          path: ./.test_report
+  build_image:
+    executor: amd64_executor
+    steps:
+      - checkout
+      - run:
+          name: "Login to Docker Gitlab Registry HUB"
+          command: docker login -u $DOCKER_LOGIN -p $GITLAB_TOKEN $DOCKER_REGISTRY
+      - run:
+          name: "Install tonistiigi/binfmt"
+          command: docker run --rm --privileged tonistiigi/binfmt:$BINFMT_VERSION --install all
+      - run:
+          name: "Create buildx multiarch"
+          command: |
+            docker buildx create \
+            --name multiarch \
+            --use \
+            && docker buildx inspect \
+            --bootstrap \
+            --builder \
+            multiarch
+      - run:
+          name: "Build image and push to Gitlab registry HUB"
+          command: |
+            docker buildx build \
+            --platform linux/amd64,linux/arm64 \
+            --build-arg NODE_VERSION=$NODE_VERSION \
+            --build-arg NPM_VERSION=$NPM_VERSION \
+            --build-arg NGINX_VERSION=$NGINX_VERSION \
+            --tag $DOCKER_IMAGE:$CIRCLE_TAG \
+            --tag $DOCKER_IMAGE:latest \
+            --push \
+            --file dockerfiles/production/build/Dockerfile \
+            "."
+  deploy_to_vps:
+    executor: amd64_executor
     steps:
       - checkout
-      - run: npm install -g [email protected]
-      - run: npm ci
-      - run: CI=true npm run test
-
+      - run:
+          name: "Deploy to VPS"
+          command: |
+            ssh-keyscan -p $VPS01_OCI_PORT -H $VPS01_OCI_URL >> ~/.ssh/known_hosts
+            echo "-----BEGIN OPENSSH PRIVATE KEY-----" >> ~/.ssh/circleci
+            echo $VPS01_OCI_PRIVATE_SSH_KEY >> ~/.ssh/circleci
+            echo "-----END OPENSSH PRIVATE KEY-----" >> ~/.ssh/circleci
+            chmod 0600 ~/.ssh/circleci
+            ssh-add ~/.ssh/circleci
+            # Replace docker-compose.yml
+            echo ""
+            echo ""
+            echo ">>>>> REPLACE docker-compose.yml"
+            echo ""
+            echo ""
+            scp \
+            -P $VPS01_OCI_PORT \
+            dockerfiles/production/deploy/docker-compose.yml \
+            $VPS01_OCI_USERNAME@$VPS01_OCI_URL:$FOLDER_APP
+            # Pull new image
+            echo ""
+            echo ""
+            echo ">>>>> PULL AND START NEW IMAGE"
+            echo ""
+            echo ""
+            ssh -t $VPS01_OCI_USERNAME@$VPS01_OCI_URL -p $VPS01_OCI_PORT \
+              "docker pull $DOCKER_IMAGE:$CIRCLE_TAG \
+              && cd $FOLDER_APP \
+              && docker compose stop \
+              && docker container rm $FOLDER_APP \
+              && docker compose up -d \
+              && exit"
+            # Remove all images but not current
+            echo ""
+            echo ""
+            echo ">>>>> REMOVE OLD IMAGES"
+            echo ""
+            echo ""
+            ssh -t $VPS01_OCI_USERNAME@$VPS01_OCI_URL -p $VPS01_OCI_PORT \
+              "docker images | \
+              grep $FOLDER_APP | \
+              tr -s ' ' | \
+              cut -d ' ' -f 2 | \
+              grep -v 1.3.0 | \
+              xargs -I {} docker rmi $DOCKER_IMAGE:{} \
+              && exit"
 workflows:
-  version: 2
-  test:
+  test_build_deploy:
     jobs:
       - test:
           filters:
             branches:
               only:
                 - master
                 - develop
+      - build_image:
+          context: SECRETS
+          filters:
+            tags:
+              only: /.*/
+            branches:
+              ignore: /.*/
+      - deploy_to_vps:
+          context: SECRETS
+          filters:
+            tags:
+              only: /.*/
+            branches:
+              ignore: /.*/
+          requires:
+            - build_image

.dockerignore

@@ -1,7 +1,39 @@
-.circleci/
-.husky/
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+.yarn/install-state.gz
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env*.local
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts
+.husky
 .scannerwork/
-.semaphore/
-coverage/
-node_modules/
-report/
+!.env

.env.bak

@@ -1,6 +1,4 @@
-REACT_APP_NAME="Bank"
-REACT_APP_VERSION=$npm_package_version
-REACT_APP_BACKEND_URL="https://bitbankapi.k2p.it/api"
-REACT_APP_LOCALSTORAGE_ACCESS_TOKEN="4fd9c72ddd8176dffe9f"
-SONAR_LOGIN=YOUR_SONAR_TOKEN_HERE
-SONAR_HOST_URL=http://localhost:9000
+APP_NAME=OnlineBankingFrontend
+SESSIONSTORAGE_ACCESS_TOKEN=6023be641de2440186a6-$APP_NAME
+NEXT_PUBLIC_BACKEND_URL=https://bitbankapi.k2p.it/api/v1/
+NEXT_TELEMETRY_DISABLED=1

.env.development

@@ -0,0 +1,3 @@
+APP_NAME=OnlineBankingFrontend
+SESSIONSTORAGE_ACCESS_TOKEN=52851573d47919a9d290-$APP_NAME
+NEXT_TELEMETRY_DISABLED=1

.env.test

@@ -1,3 +1,3 @@
-REACT_APP_NAME="Bank"
-REACT_APP_VERSION="9.8.7"
-REACT_APP_BACKEND_URL="https://api.example.com"
+APP_NAME=OnlineBankingFrontend
+SESSIONSTORAGE_ACCESS_TOKEN=52851573d47919a9d290-$APP_NAME
+NEXT_TELEMETRY_DISABLED=1

.eslintrc.js

@@ -4,8 +4,13 @@ module.exports = {
     es2021: true,
     node: true
   },
-  extends: ["plugin:react/recommended", "airbnb", "prettier"],
-  ignorePatterns: ["src/__tests__/*", "node_modules/", "src/setupTests.js"],
+  extends: [
+    "plugin:react/recommended",
+    "airbnb",
+    "prettier",
+    "next/core-web-vitals"
+  ],
+  ignorePatterns: ["src/__tests__/*", "node_modules/"],
   overrides: [
     {
       files: ["*.js", "*.jsx"]
@@ -27,33 +32,49 @@ module.exports = {
         functions: "never"
       }
     ],
+    "import/extensions": [
+      "error",
+      "ignorePackages",
+      {
+        js: "never",
+        jsx: "never",
+        ts: "never",
+        tsx: "never"
+      }
+    ],
+    "import/no-named-as-default": 0,
+    "import/prefer-default-export": 0,
+    "jsx-a11y/control-has-associated-label": 0,
     "linebreak-style": ["error", "unix"],
     "multiline-ternary": 0,
+    "no-param-reassign": [
+      "error",
+      {
+        props: true,
+        ignorePropertyModificationsFor: ["state", "accumulator"]
+      }
+    ],
     "no-restricted-syntax": [
       "error",
       "ForInStatement",
       "LabeledStatement",
       "WithStatement"
     ],
     "react/destructuring-assignment": [1, "always"],
-    "react/jsx-props-no-spreading": 1,
-    "react/prop-types": 0,
-    "react/no-unstable-nested-components": 0,
+    "react/forbid-prop-types": [1, { forbid: ["any"] }],
     "react/function-component-definition": [
       2,
       {
         namedComponents: ["arrow-function", "function-declaration"],
         unnamedComponents: "arrow-function"
       }
     ],
-    semi: [2, "always"],
-    "no-param-reassign": [
-      "error",
-      {
-        props: true,
-        ignorePropertyModificationsFor: ["state", "accumulator"]
-      }
-    ]
+    "react/jsx-filename-extension": [2, { extensions: [".jsx", ".tsx"] }],
+    "react/jsx-props-no-spreading": 1,
+    "react/no-unstable-nested-components": 0,
+    "react/require-default-props": [2, { functions: "defaultArguments" }],
+    "react/prop-types": 0,
+    semi: [2, "always"]
   },
   settings: {
     react: {

.gitignore

@@ -4,27 +4,38 @@
 /node_modules
 /.pnp
 .pnp.js
+.yarn/install-state.gz
 
 # testing
 /coverage
 
+# next.js
+/.next/
+/out/
+
 # production
 /build
 
 # misc
 .DS_Store
-.env.local
-.env.development.local
-.env.test.local
-.env.production.local
+*.pem
 
+# debug
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
 
-.scannerwork/
-data/
+# local env files
+.env*.local
 
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts
+.scannerwork/
 .env
-hs*.log
-report/
+dockerfiles/mocks/node_modules/
+.swc/
+.test_report/

.husky/pre-commit

@@ -1,4 +1,4 @@
 #!/usr/bin/env sh
 . "$(dirname -- "$0")/_/husky.sh"
 
-CI=true npm run eslint
+npm run lint

.nvmrc

@@ -1 +1 @@
-v20.11.0
+v20.12.1

.prettierignore

@@ -0,0 +1,3 @@
+node_modules/
+build/
+coverage/