Chg: helm set v2.0.0-RC1 image

.env

@@ -1 +0,0 @@
-VITE_UCENTRALSEC_URL="https://ucentral.dpaas.arilia.com:16001"

.eslintignore

@@ -1,10 +1,4 @@
 /src/assets
 /build
 /node_modules
-/dist
-/icons
-helm
-docker-entrypoint.d
-.dockerignore
-DockerFile
 .github

.eslintrc

@@ -1,80 +1,22 @@
 {
+  "extends": ["airbnb", "prettier"],
+  "plugins": ["prettier"],
   "env": {
-    "browser": true,
-    "es2021": true
+      "browser": true,
+      "jest": true
   },
-  "parser": "@typescript-eslint/parser",
-  "parserOptions": {
-    "ecmaFeatures": {
-      "jsx": true
-    },
-    "ecmaVersion": 12,
-    "sourceType": "module",
-    "allowImportExportEverywhere": false,
-    "codeFrame": false,
-    "project": "./tsconfig.json"
-  },
-  "ignorePatterns": ["build/", "dist/"],
-  "extends": [
-    "plugin:react/recommended",
-    "plugin:@typescript-eslint/eslint-recommended",
-    "plugin:@typescript-eslint/recommended",
-    "airbnb",
-    "airbnb-typescript",
-    "prettier",
-    "plugin:import/errors",
-    "plugin:import/warnings",
-    "plugin:import/typescript"
-  ],
-  "plugins": ["import", "react", "@typescript-eslint", "prettier"],
   "rules": {
-    "import/extensions": [
-      "error",
-      "ignorePackages",
-      {
-        "js": "never",
-        "jsx": "never",
-        "ts": "never",
-        "tsx": "never"
-      }
-    ],
-    "@typescript-eslint/naming-convention": [
-      "error",
-      {
-        "selector": "function",
-        "format": ["PascalCase", "camelCase"],
-        "leadingUnderscore": "allowSingleOrDouble"
-      }
-    ],
-    "no-restricted-syntax": ["error", "ForInStatement", "LabeledStatement", "WithStatement"],
-    "react/function-component-definition": [2, { "namedComponents": "arrow-function" }],
-    "import/order": [
-      "error",
-      {
-        "alphabetize": {
-          "order": "asc",
-          "caseInsensitive": true
-        },
-        "newlines-between": "never",
-        "groups": ["builtin", "external", "parent", "sibling", "index"],
-        "pathGroups": [
-          {
-            "pattern": "react",
-            "group": "external",
-            "position": "before"
-          }
-        ],
-        "pathGroupsExcludedImportTypes": ["builtin"]
-      }
-    ],
-    "max-len": ["error", { "code": 150 }],
-    "@typescript-eslint/ban-ts-comment": ["off"],
-    "import/prefer-default-export": ["off"],
+    "max-len": ["error", {"code": 150}],
+    "prefer-promise-reject-errors": ["off"],
+    "react/jsx-filename-extension": ["off"],
     "react/prop-types": ["warn"],
-    "react/require-default-props": "off",
+    "no-return-assign": ["off"],
     "react/jsx-props-no-spreading": ["off"],
-    "react/jsx-curly-newline": "off",
-    "no-underscore-dangle": "off"
+    "react/destructuring-assignment": ["off"],
+    "no-restricted-syntax": ["error", "ForInStatement", "LabeledStatement", "WithStatement"],
+    "react/jsx-one-expression-per-line": "off",
+    "react/jsx-wrap-multilines": "off",
+    "react/jsx-curly-newline": "off"
   },
   "settings": {
     "import/resolver": {
@@ -82,5 +24,11 @@
         "paths": ["src"]
       }
     }
-  }
+  },
+    "parser": "babel-eslint",
+    "parserOptions": {
+      "sourceType": "module",
+      "allowImportExportEverywhere": false,
+      "codeFrame": false
+    }
 }

.github/workflows/ci.yml

@@ -12,7 +12,6 @@ on:
   pull_request:
     branches:
       - main
-      - 'release/*'
 
 defaults:
   run:
@@ -25,48 +24,45 @@ jobs:
       DOCKER_REGISTRY_URL: tip-tip-wlan-cloud-ucentral.jfrog.io
       DOCKER_REGISTRY_USERNAME: ucentral
     steps:
-    - name: Checkout actions repo
-      uses: actions/checkout@v3
-      with:
-        repository: Telecominfraproject/.github
-        path: github
+    - uses: actions/checkout@v2
 
-    - name: Build and push Docker image
-      uses: ./github/composite-actions/docker-image-build
-      with:
-        image_name: owgw-ui
-        registry: tip-tip-wlan-cloud-ucentral.jfrog.io
-        registry_user: ucentral
-        registry_password: ${{ secrets.DOCKER_REGISTRY_PASSWORD }}
+    - name: Build Docker image
+      run: docker build -t owgw-ui:${{ github.sha }} .
 
-    - name: Notify on failure via Slack
-      if: failure() && github.ref == 'refs/heads/main'
-      uses: rtCamp/action-slack-notify@v2
-      env:
-        SLACK_USERNAME: GitHub Actions failure notifier
-        SLACK_WEBHOOK: ${{ secrets.SLACK_WEBHOOK }}
-        SLACK_COLOR: "${{ job.status }}"
-        SLACK_ICON: https://raw.githubusercontent.com/quintessence/slack-icons/master/images/github-logo-slack-icon.png
-        SLACK_TITLE: Docker build failed for OWGW-UI service
+    - name: Tag Docker image
+      run: |
+        TAGS="${{ github.sha }}"
 
-  trigger-deploy-to-dev:
-    runs-on: ubuntu-latest
-    if: github.ref == 'refs/heads/main'
-    needs:
-      - docker
-    steps:
-    - name: Checkout actions repo
-      uses: actions/checkout@v3
-      with:
-        repository: Telecominfraproject/.github
-        path: github
+        if [[ ${GITHUB_REF} == "refs/heads/"* ]]
+        then
+          CURRENT_TAG=$(echo ${GITHUB_REF#refs/heads/} | tr '/' '-')
+          TAGS="$TAGS $CURRENT_TAG"
+        else
+          if [[ ${GITHUB_REF} == "refs/tags/"* ]]
+          then
+            CURRENT_TAG=$(echo ${GITHUB_REF#refs/tags/} | tr '/' '-')
+            TAGS="$TAGS $CURRENT_TAG"
+          else # PR build
+            CURRENT_TAG=$(echo ${GITHUB_HEAD_REF#refs/heads/} | tr '/' '-')
+            TAGS="$TAGS $CURRENT_TAG"
+          fi
+        fi
 
-    - name: Trigger deployment of the latest version to dev instance and wait for result
-      uses: ./github/composite-actions/trigger-workflow-and-wait
+        echo "Result tags: $TAGS"
+
+        for tag in $TAGS; do
+          docker tag owgw-ui:${{ github.sha }} ${{ env.DOCKER_REGISTRY_URL }}/owgw-ui:$tag
+        done
+
+    - name: Log into Docker registry
+      if: startsWith(github.ref, 'refs/tags/') || startsWith(github.ref, 'refs/pull/') || github.ref == 'refs/heads/main'
+      uses: docker/login-action@v1
       with:
-        owner: Telecominfraproject
-        repo: wlan-testing
-        workflow: ucentralgw-dev-deployment.yaml
-        token: ${{ secrets.WLAN_TESTING_PAT }}
-        ref: master
-        inputs: '{"force_latest": "true"}'
+        registry: ${{ env.DOCKER_REGISTRY_URL }}
+        username: ${{ env.DOCKER_REGISTRY_USERNAME }}
+        password: ${{ secrets.DOCKER_REGISTRY_PASSWORD }}
+
+    - name: Push Docker images
+      if: startsWith(github.ref, 'refs/tags/') || startsWith(github.ref, 'refs/pull/') || github.ref == 'refs/heads/main'
+      run: |
+        docker images | grep ${{ env.DOCKER_REGISTRY_URL }}/owgw-ui | awk -F ' ' '{print $1":"$2}' | xargs -I {} docker push {}

.github/workflows/cleanup.yml

@@ -4,7 +4,6 @@ on:
   pull_request:
     branches:
       - main
-      - 'release/*'
     types: [ closed ]
 
 defaults:
@@ -17,10 +16,4 @@ jobs:
     steps:
       - run: |
           export PR_BRANCH_TAG=$(echo ${GITHUB_HEAD_REF#refs/heads/} | tr '/' '-')
-
-          if [[ ! $PR_BRANCH_TAG =~ (main|master|release-*) ]]; then
-            echo "PR branch is $PR_BRANCH_TAG, deleting Docker image"
-            curl -s -uucentral:${{ secrets.DOCKER_REGISTRY_PASSWORD }} -X DELETE "https://tip.jfrog.io/artifactory/tip-wlan-cloud-ucentral/owgw-ui/$PR_BRANCH_TAG"
-          else
-            echo "PR branch is $PR_BRANCH_TAG, not deleting Docker image"
-          fi
+          curl -uucentral:${{ secrets.DOCKER_REGISTRY_PASSWORD }} -X DELETE "https://tip.jfrog.io/artifactory/tip-wlan-cloud-ucentral/owgw-ui/$PR_BRANCH_TAG"

.github/workflows/enforce-jira-issue-key.yml

@@ -1,24 +0,0 @@
-name: Ensure Jira issue is linked
-
-on:
-  pull_request:
-    types: [opened, edited, reopened, synchronize]
-    branches:
-      - 'release/*'
-
-jobs:
-  check_for_issue_key:
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout actions repo
-        uses: actions/checkout@v3
-        with:
-          repository: Telecominfraproject/.github
-          path: github
-
-      - name: Run JIRA check
-        uses: ./github/composite-actions/enforce-jira-issue-key
-        with:
-          jira_base_url: ${{ secrets.TIP_JIRA_URL }}
-          jira_user_email: ${{ secrets.TIP_JIRA_USER_EMAIL }}
-          jira_api_token: ${{ secrets.TIP_JIRA_API_TOKEN }}

.github/workflows/release.yml

@@ -1,46 +0,0 @@
-name: Release chart package
-
-on:
-  push:
-    tags:
-      - 'v*'
-
-defaults:
-  run:
-    shell: bash
-
-jobs:
-  helm-package:
-    runs-on: ubuntu-20.04
-    env:
-      HELM_REPO_URL: https://tip.jfrog.io/artifactory/tip-wlan-cloud-ucentral-helm/
-      HELM_REPO_USERNAME: ucentral
-    steps:
-      - name: Checkout uCentral assembly chart repo
-        uses: actions/checkout@v3
-        with:
-          path: wlan-cloud-ucentralgw-ui
-
-      - name: Build package
-        working-directory: wlan-cloud-ucentralgw-ui/helm
-        run: |
-          helm plugin install https://github.com/aslafy-z/helm-git --version 0.10.0
-          helm repo add bitnami https://charts.bitnami.com/bitnami
-          helm repo update
-          helm dependency update
-          mkdir dist
-          helm package . -d dist
-
-      - name: Generate GitHub release body
-        working-directory: wlan-cloud-ucentralgw-ui/helm
-        run: |
-          pip3 install yq -q
-          echo "Docker image - tip-tip-wlan-cloud-ucentral.jfrog.io/owgw-ui:$GITHUB_REF_NAME" > release.txt
-          echo "Helm charted may be attached to this release" >> release.txt
-          echo "Deployment artifacts may be found in https://github.com/Telecominfraproject/wlan-cloud-ucentral-deploy/tree/$GITHUB_REF_NAME" >> release.txt
-
-      - name: Create GitHub release
-        uses: softprops/action-gh-release@v1
-        with:
-          body_path: wlan-cloud-ucentralgw-ui/helm/release.txt
-          files: wlan-cloud-ucentralgw-ui/helm/dist/*

.gitignore

@@ -1,8 +1,9 @@
+
+
 # dependencies
 /node_modules
 /.pnp
 .pnp.js
-/dev-dist
 
 # testing
 /coverage
@@ -18,4 +19,5 @@
 .env.production.local
 
 npm-debug.log*
-.vscode/settings.json
+yarn-debug.log*
+yarn-error.log*

.prettierignore

@@ -1,6 +1,4 @@
 /src/assets
 build
-dist
 node_modules
 .github
-/helm

.prettierrc

@@ -1,7 +1,7 @@
-{
-  "printWidth": 120,
-  "trailingComma": "all",
-  "tabWidth": 2,
-  "semi": true,
-  "singleQuote": true
-}
+{ 
+    "printWidth": 100,
+    "trailingComma": "all",
+    "tabWidth": 2, 
+    "semi": true, 
+    "singleQuote": true
+}

Dockerfile

@@ -1,8 +1,6 @@
-FROM node:18.7.0-alpine3.15 AS build
+FROM node:14-alpine3.11 AS build
 
-WORKDIR /app
-
-COPY package.json package-lock.json /app/
+COPY package.json package-lock.json /
 
 RUN npm install
 
@@ -10,8 +8,8 @@ COPY . .
 
 RUN npm run build
 
-FROM nginx:1.22.0-alpine AS runtime
+FROM nginx:1.20.1-alpine AS runtime
 
-COPY --from=build /app/build/ /usr/share/nginx/html/
+COPY --from=build /build/ /usr/share/nginx/html/
 
-COPY --from=build /app/docker-entrypoint.d/40-generate-config.sh /docker-entrypoint.d/40-generate-config.sh
+COPY --from=build docker-entrypoint.d/40-generate-config.sh /docker-entrypoint.d/40-generate-config.sh

README.md

@@ -1,7 +1,6 @@
 # uCentralGW UI
 
 ## What is this?
-
 The uCentralGW Client is a user interface that lets you monitor and manage devices connected to the [uCentral gateway](https://github.com/Telecominfraproject/wlan-cloud-ucentralgw). To use the interface,
 you either need to run it on your machine for [development](#development) or build it for [production](#production).
 
@@ -10,34 +9,40 @@ NOTE: This UI will be evolving as micro services are added to the uCentral progr
 ## Running the solution
 
 ### Development
-
 You need to run these commands in the root folder of the project and also have npm installed on your machine.
-
 ```
 git clone https://github.com/Telecominfraproject/wlan-cloud-ucentralgw-ui
 cd wlan-cloud-ucentralgw-ui
 npm install
-npm run dev
+npm start
+```
+
+Run these commands if you want to run the solution on your machine while also doing development on the [uCentral UI Library](https://github.com/Telecominfraproject/wlan-cloud-ucentral-ui-libs).
+```
+git clone https://github.com/Telecominfraproject/wlan-cloud-ucentralgw-ui
+git clone https://github.com/Telecominfraproject/wlan-cloud-ucentral-ui-libs
+cd wlan-cloud-ucentralgw-ui
+npm link ../wlan-cloud-ucentral-ui-libs // Add sudo at the start of this command if it fails because of permissions
+npm start
 ```
 
 ### Production
-
 You need to run this in the root folder of the project and also have npm installed on your machine.
-
 ```
 git clone https://github.com/Telecominfraproject/wlan-cloud-ucentralgw-ui
 cd wlan-cloud-ucentralgw-ui
 npm install
 npm run build
 ```
-
 Once the build is done, you can move the `build` folder on your server.
 
 ### Configuration
+You must change the `config.json` file in `public` directory to point to your uCentral Security Service URL (uCentralSec). You may also limit the ability for users to change the default uCentralSec. If you do not allow a uCentralSec change, the uCentralSec URL will not appear on the login screen. 
 
-You can control the uCentral Security Service URL (uCentralSec) by modifying the ENV variable "VITE_UCENTRALSEC_URL". There is an example .env file located at the root of this repository.
-Here are the current default values:
-
+Here are the current default values: 
 ```
-VITE_UCENTRALSEC_URL="https://ucentral.dpaas.arilia.com:16001"
+{
+  "DEFAULT_UCENTRALSEC_URL": "https://ucentral.dpaas.arilia.com:16001",
+  "ALLOW_UCENTRALSEC_CHANGE": false
+}
 ```

babel.config.json

@@ -0,0 +1,25 @@
+{
+  "presets": [
+    [
+      "@babel/preset-env",
+      {
+        "modules": false
+      }
+    ],
+    "@babel/preset-react"
+  ],
+  "env": {
+    "production": {
+      "plugins": [
+        "@babel/plugin-transform-react-inline-elements",
+        "@babel/plugin-transform-react-constant-elements",
+        [
+          "transform-react-remove-prop-types",
+          {
+            "removeImport": true
+          }
+        ]
+      ]
+    }
+  }
+}

config/paths.js

@@ -0,0 +1,12 @@
+const path = require('path');
+
+module.exports = {
+  // Source files
+  src: path.resolve(__dirname, '../src'),
+
+  // Production build files
+  build: path.resolve(__dirname, '../build'),
+
+  // Static files that get copied to build folder
+  public: path.resolve(__dirname, '../public'),
+};

config/webpack.common.js

@@ -0,0 +1,79 @@
+/* eslint-disable import/no-extraneous-dependencies */
+/* eslint-disable prefer-template */
+const { CleanWebpackPlugin } = require('clean-webpack-plugin');
+const CopyWebpackPlugin = require('copy-webpack-plugin');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+const MiniCssExtractPlugin = require('mini-css-extract-plugin');
+const webpack = require('webpack');
+const path = require('path');
+const paths = require('./paths');
+
+module.exports = {
+  entry: [paths.src + '/index.js'],
+  output: {
+    path: paths.build,
+    filename: '[name].bundle.js',
+    publicPath: '/',
+  },
+  resolve: {
+    modules: [path.resolve('./node_modules'), path.resolve('./src')],
+    preferRelative: true,
+  },
+  plugins: [
+    new webpack.DefinePlugin({
+      'process.env.VERSION': JSON.stringify(process.env.npm_package_version),
+    }),
+    new MiniCssExtractPlugin({
+      filename: 'styles/[name].[contenthash].css',
+      chunkFilename: '[id].[contenthash].css',
+    }),
+    new CopyWebpackPlugin({
+      patterns: [
+        {
+          from: paths.src + '/assets',
+          to: 'assets',
+          globOptions: {
+            ignore: ['*.DS_Store'],
+          },
+        },
+        {
+          from: paths.public + '/locales',
+          to: 'locales',
+          globOptions: {
+            ignore: ['*.DS_Store'],
+          },
+        },
+        {
+          from: paths.public + '/config.json',
+          to: 'config.json',
+        },
+      ],
+    }),
+    new HtmlWebpackPlugin({
+      title: 'uCentralGW',
+      favicon: paths.public + '/favicon.ico',
+      template: paths.public + '/index.html',
+      filename: 'index.html',
+    }),
+    new CleanWebpackPlugin(),
+  ],
+
+  module: {
+    rules: [
+      {
+        test: /\.(js|jsx)$/,
+        exclude: /node_modules/,
+        use: ['babel-loader'],
+      },
+      {
+        test: /\.(css|scss)$/,
+        use: [MiniCssExtractPlugin.loader, 'css-loader', 'sass-loader'],
+      },
+      {
+        test: /\.svg$/,
+        use: ['@svgr/webpack'],
+      },
+      { test: /\.(?:ico|gif|png|jpg|jpeg)$/i, type: 'asset/resource' },
+    ],
+  },
+};

config/webpack.dev.js

@@ -0,0 +1,54 @@
+/* eslint-disable import/no-extraneous-dependencies */
+/* eslint-disable prefer-template */
+const ReactRefreshWebpackPlugin = require('@pmmmwh/react-refresh-webpack-plugin');
+const { merge } = require('webpack-merge');
+const path = require('path');
+const paths = require('./paths');
+const common = require('./webpack.common');
+
+module.exports = merge(common, {
+  mode: 'development',
+
+  target: 'web',
+
+  devtool: 'inline-source-map',
+
+  devServer: {
+    historyApiFallback: true,
+    contentBase: paths.build,
+    open: true,
+    compress: false,
+    hot: true,
+    port: 3000,
+  },
+  module: {
+    rules: [
+      {
+        test: /\.[js]sx?$/,
+        exclude: /node_modules/,
+        use: [
+          {
+            loader: require.resolve('babel-loader'),
+            options: {
+              plugins: [require.resolve('react-refresh/babel')],
+            },
+          },
+        ],
+      },
+    ],
+  },
+  resolve: {
+    modules: [
+      'node_modules',
+      'src',
+      path.resolve(__dirname, '../', 'node_modules', 'ucentral-libs', 'src'),
+    ],
+    alias: {
+      react: path.resolve(__dirname, '../', 'node_modules', 'react'),
+      'react-router-dom': path.resolve('./node_modules/react-router-dom'),
+      'ucentral-libs': path.resolve(__dirname, '../', 'node_modules', 'ucentral-libs', 'src'),
+      graphlib: path.resolve(__dirname, '../', 'node_modules', 'graphlib'),
+    },
+  },
+  plugins: [new ReactRefreshWebpackPlugin()],
+});

config/webpack.prod.js

@@ -0,0 +1,86 @@
+/* eslint-disable import/no-extraneous-dependencies */
+/* eslint-disable prefer-template */
+const { merge } = require('webpack-merge');
+const MiniCssExtractPlugin = require('mini-css-extract-plugin');
+const CssMinimizerPlugin = require('css-minimizer-webpack-plugin');
+const TerserPlugin = require('terser-webpack-plugin');
+const CompressionPlugin = require('compression-webpack-plugin');
+const path = require('path');
+const paths = require('./paths');
+const common = require('./webpack.common');
+
+module.exports = merge(common, {
+  mode: 'production',
+  devtool: false,
+  output: {
+    path: paths.build,
+    publicPath: '/',
+    filename: 'js/[name].[contenthash].bundle.js',
+  },
+  plugins: [
+    // new BundleAnalyzerPlugin(),
+    new MiniCssExtractPlugin({
+      filename: 'styles/[name].[contenthash].css',
+      chunkFilename: '[contenthash].css',
+    }),
+    new CompressionPlugin({
+      filename: '[path]/[name].gz[query]',
+      algorithm: 'gzip',
+      test: /\.js$|\.css$|\.html$|\.eot?.+$|\.ttf?.+$|\.woff?.+$|\.svg?.+$/,
+      threshold: 10240,
+      minRatio: 0.8,
+    }),
+  ],
+  module: {
+    rules: [],
+  },
+  optimization: {
+    minimize: true,
+    minimizer: [
+      '...',
+      new TerserPlugin({
+        terserOptions: {
+          warnings: false,
+          compress: {
+            comparisons: false,
+          },
+          parse: {},
+          mangle: true,
+          output: {
+            ascii_only: true,
+          },
+        },
+        parallel: true,
+      }),
+      new CssMinimizerPlugin(),
+    ],
+    nodeEnv: 'production',
+    sideEffects: true,
+    runtimeChunk: 'single',
+    splitChunks: {
+      chunks: 'all',
+      maxInitialRequests: 10,
+      minSize: 0,
+      cacheGroups: {
+        vendor: {
+          test: /[\\/]node_modules[\\/]/,
+          name(module) {
+            const packageName = module.context.match(/[\\/]node_modules[\\/](.*?)([\\/]|$)/)[1];
+            return `npm.${packageName.replace('@', '')}`;
+          },
+        },
+      },
+    },
+  },
+  resolve: {
+    modules: [],
+    alias: {
+      graphlib: path.resolve(__dirname, '../', 'node_modules', 'graphlib'),
+    },
+  },
+  performance: {
+    hints: false,
+    maxEntrypointSize: 512000,
+    maxAssetSize: 512000,
+  },
+});

docker-entrypoint.d/40-generate-config.sh

@@ -1,32 +1,6 @@
 #!/bin/ash
+# Check if variables are set
+export DEFAULT_OWSEC_URL="${DEFAULT_OWSEC_URL:-https://ucentral.dpaas.arilia.com:16001}"
+export ALLOW_OWSEC_CHANGE="${ALLOW_OWSEC_CHANGE:-false}"
 
-ENV_CONFIG_PATH=/usr/share/nginx/html/env-config.js
-
-# Recreate config file
-rm -rf $ENV_CONFIG_PATH
-touch $ENV_CONFIG_PATH
-
-# Add assignment
-echo "window._env_ = {" >> $ENV_CONFIG_PATH
-
-# Read each line in .env file
-# Each line represents key=value pairs
-env | grep REACT_ | while read -r line || [[ -n "$line" ]];
-do
-  echo $line
-  # Split env variables by character `=`
-  if printf '%s\n' "$line" | grep -q -e '='; then
-    varname=$(printf '%s\n' "$line" | sed -e 's/=.*//')
-    varvalue=$(printf '%s\n' "$line" | sed -e 's/^[^=]*=//')
-  fi
-
-  # Read value of current variable if exists as Environment variable
-  value=$(printf '%s\n' "${!varname}")
-  # Otherwise use value from .env file
-  [[ -z $value ]] && value=${varvalue}
-
-  # Append configuration property to JS file
-  echo "  $varname: \"$value\"," >> $ENV_CONFIG_PATH
-done
-
-echo "}" >> $ENV_CONFIG_PATH
+echo '{"DEFAULT_UCENTRALSEC_URL": "'$DEFAULT_UCENTRALSEC_URL'","ALLOW_UCENTRALSEC_CHANGE": '$ALLOW_UCENTRALSEC_CHANGE'}' > /usr/share/nginx/html/config.json

helm/README.md

@@ -20,7 +20,7 @@ Currently this chart is not assembled in charts archives, so [helm-git](https://
 To install the chart with the release name `my-release`:
 
 ```bash
-$ helm install --name my-release git+https://github.com/Telecominfraproject/wlan-cloud-ucentralgw-ui@helm/owgwui-0.1.0.tgz?ref=main
+$ helm install --name my-release git+https://github.com/Telecominfraproject/wlan-cloud-ucentralgw-ui@helm?ref=main
 ```
 
 The command deploys the Web UI on the Kubernetes cluster in the default configuration. The [configuration](#configuration) section lists the parameters that can be configured during installation.

helm/templates/_helpers.tpl

@@ -30,13 +30,3 @@ Create chart name and version as used by the chart label.
 {{- define "owgwui.chart" -}}
 {{- printf "%s-%s" .Chart.Name .Chart.Version | replace "+" "_" | trunc 63 | trimSuffix "-" -}}
 {{- end -}}
-
-{{- define "owgwui.ingress.apiVersion" -}}
-  {{- if .Capabilities.APIVersions.Has "networking.k8s.io/v1" -}}
-      {{- print "networking.k8s.io/v1" -}}
-  {{- else if .Capabilities.APIVersions.Has "networking.k8s.io/v1beta1" -}}
-    {{- print "networking.k8s.io/v1beta1" -}}
-  {{- else -}}
-    {{- print "extensions/v1beta1" -}}
-  {{- end -}}
-{{- end -}}

helm/templates/deployment.yaml

@@ -11,7 +11,6 @@ metadata:
     app.kubernetes.io/managed-by: {{ .Release.Service }}
 spec:
   replicas: {{ .Values.replicaCount }}
-  revisionHistoryLimit: {{ .Values.revisionHistoryLimit }}
   selector:
     matchLabels:
       app.kubernetes.io/name: {{ include "owgwui.name" . }}
@@ -27,12 +26,6 @@ spec:
         {{- with .Values.services.owgwui.labels }}
         {{- toYaml . | nindent 8 }}
         {{- end }}
-      {{- if .Values.podAnnotations }}
-      annotations:
-        {{- with .Values.podAnnotations }}
-        {{- toYaml . | nindent 8 }}
-        {{- end }}
-      {{- end }}
     spec:
 
       containers:

helm/templates/ingress.yaml

@@ -2,7 +2,7 @@
 {{- range $ingress, $ingressValue := .Values.ingresses }}
 {{- if $ingressValue.enabled }}
 ---
-apiVersion: {{ include "owgwui.ingress.apiVersion" $root }}
+apiVersion: extensions/v1beta1
 kind: Ingress
 metadata:
   name: {{ include "owgwui.fullname" $root }}-{{ $ingress }}
@@ -17,9 +17,7 @@ metadata:
   {{- end }}
 
 spec:
-{{- if $ingressValue.className }}
-  ingressClassName: {{ $ingressValue.className }}
-{{- end }}
+
 {{- if $ingressValue.tls }}
   tls:
   {{- range $ingressValue.tls }}
@@ -38,23 +36,9 @@ spec:
       paths:
       {{- range $ingressValue.paths }}
         - path: {{ .path }}
-          {{- if $root.Capabilities.APIVersions.Has "networking.k8s.io/v1" }}
-          pathType: {{ .pathType | default "ImplementationSpecific" }}
-          {{- end }}
           backend:
-            {{- if $root.Capabilities.APIVersions.Has "networking.k8s.io/v1" }}
-            service:
-              name: {{ include "owgwui.fullname" $root }}-{{ .serviceName }}
-              port:
-              {{- if kindIs "string" .servicePort }}
-                name: {{ .servicePort }}
-              {{- else }}
-                number: {{ .servicePort }}
-              {{- end }}
-            {{- else }}
             serviceName: {{ include "owgwui.fullname" $root }}-{{ .serviceName }}
             servicePort: {{ .servicePort }}
-            {{- end }}
       {{- end }}
   {{- end }}
 

helm/values.yaml

@@ -1,6 +1,5 @@
 # System
 replicaCount: 1
-revisionHistoryLimit: 2
 
 nameOverride: ""
 fullnameOverride: ""
@@ -8,7 +7,7 @@ fullnameOverride: ""
 images:
   owgwui:
     repository: tip-tip-wlan-cloud-ucentral.jfrog.io/owgw-ui
-    tag: v3.2.0
+    tag: v2.2.0-RC1
     pullPolicy: Always
 
 services:
@@ -49,7 +48,6 @@ ingresses:
     - chart-example.local
     paths:
     - path: /
-      pathType: ImplementationSpecific
       serviceName: owgwui
       servicePort: http
 
@@ -71,8 +69,7 @@ tolerations: []
 
 affinity: {}
 
-podAnnotations: {}
-
 # Application
 public_env_variables:
-  REACT_APP_UCENTRALSEC_URL: https://ucentral.dpaas.arilia.com:16001
+  DEFAULT_UCENTRALSEC_URL: https://ucentral.dpaas.arilia.com:16001
+  ALLOW_UCENTRALSEC_CHANGE: false

index.html

@@ -1,21 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <meta charset="utf-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <title>Controller</title>
-    <meta name="description" content="OpenWiFi Controller App" />
-    <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />
-    <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png" />
-    <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png" />
-    <link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5" />
-    <meta name="msapplication-TileColor" content="#da532c" />
-    <script src="/env-config.js"></script>
-    <meta name="theme-color" content="#000000" />
-  </head>
-  <body>
-    <noscript>You need to enable JavaScript to run this app.</noscript>
-    <div id="root"></div>
-    <script type="module" src="./src/index.tsx"></script>
-  </body>
-</html>

jsconfig.json

@@ -0,0 +1,9 @@
+{
+  "compilerOptions": {
+    "baseUrl": "src",
+    "paths": {
+      "*": ["*"]
+    }
+  },
+  "include": ["src"]
+}

package.json

@@ -1,101 +1,99 @@
 {
   "name": "ucentral-client",
-  "version": "3.2.0",
-  "description": "",
-  "private": true,
-  "main": "index.tsx",
-  "scripts": {
-    "dev": "vite",
-    "build": "vite build",
-    "format": "prettier --write \"src/**/*x.{ts,tsx,js,jsx}\"",
-    "analyze": "source-map-explorer 'build/static/js/*.js'",
-    "lint": "TIMING=1 eslint \"src/**/*.{ts,tsx,js,jsx}\" --fix",
-    "clean": "rm -rf node_modules && rm -rf build"
-  },
-  "author": "",
-  "license": "ISC",
+  "version": "2.2.2",
   "dependencies": {
-    "@chakra-ui/anatomy": "^2.1.1",
-    "@chakra-ui/icons": "^2.0.18",
-    "@chakra-ui/react": "^2.3.6",
-    "@chakra-ui/styled-system": "^2.9.0",
-    "@chakra-ui/theme-tools": "^2.0.12",
-    "@chakra-ui/utils": "^2.0.14",
-    "@emotion/react": "^11.10.6",
-    "@emotion/styled": "^11.10.6",
-    "@fontsource/inter": "^4.5.15",
-    "@googlemaps/react-wrapper": "^1.1.35",
-    "@googlemaps/typescript-guards": "^2.0.3",
-    "@hello-pangea/dnd": "^16.2.0",
-    "@phosphor-icons/react": "^2.0.8",
-    "@react-spring/web": "^9.7.2",
-    "@tanstack/react-query": "^4.29.3",
-    "@tanstack/react-table": "^8.8.5",
-    "@textea/json-viewer": "^2.16.2",
-    "axios": "^1.3.5",
-    "buffer": "^6.0.3",
-    "chakra-react-select": "^4.6.0",
-    "chart.js": "^3.9.1",
+    "@coreui/coreui": "^3.4.0",
+    "@coreui/icons": "^2.0.1",
+    "@coreui/icons-react": "^1.1.0",
+    "@coreui/react": "^3.4.6",
+    "@coreui/react-chartjs": "^1.1.0",
+    "apexcharts": "^3.27.1",
+    "axios": "^0.21.1",
+    "axios-retry": "^3.1.9",
     "dagre": "^0.8.5",
-    "fast-equals": "^5.0.1",
-    "formik": "^2.2.9",
-    "framer-motion": "^10.12.2",
-    "i18next": "^22.4.14",
-    "i18next-browser-languagedetector": "^7.0.1",
-    "i18next-http-backend": "^2.2.0",
-    "libphonenumber-js": "^1.10.26",
-    "prop-types": "^15.8.1",
-    "react": "^18.2.0",
-    "react-app-polyfill": "^3.0.0",
-    "react-chartjs-2": "^4.3.1",
-    "react-country-flag": "^3.1.0",
-    "react-csv": "^2.2.2",
-    "react-datepicker": "^4.11.0",
-    "react-dom": "^18.2.0",
-    "react-fast-compare": "^3.2.1",
-    "react-i18next": "^12.2.0",
-    "react-masonry-css": "^1.0.16",
-    "react-router-dom": "^6.10.0",
-    "react-table": "^7.8.0",
-    "react-virtualized-auto-sizer": "^1.0.15",
-    "react-window": "^1.8.9",
-    "source-map-explorer": "^2.5.3",
-    "typescript": "^5.0.4",
-    "uuid": "^9.0.0",
-    "vite": "^4.2.1",
-    "yup": "^0.32.11",
-    "zustand": "^4.3.7"
+    "i18next": "^20.3.1",
+    "i18next-browser-languagedetector": "^6.1.2",
+    "i18next-http-backend": "^1.2.6",
+    "prop-types": "^15.7.2",
+    "react": "^17.0.2",
+    "react-apexcharts": "^1.3.9",
+    "react-dom": "^17.0.2",
+    "react-flow-renderer": "^9.6.6",
+    "react-i18next": "^11.11.0",
+    "react-paginate": "^7.1.3",
+    "react-router-dom": "^5.2.0",
+    "react-select": "^4.3.1",
+    "react-tooltip": "^4.2.21",
+    "react-widgets": "^5.1.1",
+    "sass": "^1.35.1",
+    "ucentral-libs": "^0.9.41",
+    "uuid": "^8.3.2"
+  },
+  "main": "index.js",
+  "scripts": {
+    "start": "webpack serve --config config/webpack.dev.js",
+    "build": "webpack --config config/webpack.prod.js",
+    "format": "prettier --write 'src/**/*.js'",
+    "eslint-fix": "eslint --fix 'src/**/*.js'"
+  },
+  "eslintConfig": {
+    "extends": "react-app"
+  },
+  "husky": {
+    "hooks": {
+      "pre-commit": "lint-staged"
+    }
+  },
+  "lint-staged": {
+    "*.{js,jsx}": [
+      "eslint",
+      "prettier --write"
+    ]
   },
   "devDependencies": {
-    "@types/google.maps": "^3.52.5",
-    "@types/node": "^18.15.11",
-    "@types/react": "^18.0.37",
-    "@types/react-csv": "^1.1.3",
-    "@types/react-datepicker": "4.10.0",
-    "@types/react-dom": "^18.0.11",
-    "@types/react-table": "^7.7.14",
-    "@types/react-virtualized-auto-sizer": "^1.0.1",
-    "@types/react-window": "^1.8.5",
-    "@types/uuid": "^9.0.1",
-    "@vitejs/plugin-react": "^3.1.0",
-    "eslint": "8.38.0",
-    "eslint-config-airbnb": "^19.0.4",
-    "eslint-config-airbnb-typescript": "^17.0.0",
-    "eslint-config-airbnb-typescript-prettier": "^5.0.0",
-    "eslint-config-prettier": "^8.8.0",
+    "@babel/core": "^7.14.6",
+    "@babel/plugin-proposal-class-properties": "^7.14.5",
+    "@babel/plugin-transform-runtime": "^7.14.5",
+    "@babel/polyfill": "^7.12.1",
+    "@babel/preset-env": "^7.14.7",
+    "@babel/preset-react": "^7.14.5",
+    "@pmmmwh/react-refresh-webpack-plugin": "^0.4.3",
+    "@svgr/webpack": "^5.5.0",
+    "autoprefixer": "^10.2.6",
+    "babel-eslint": "^10.1.0",
+    "babel-loader": "^8.2.2",
+    "clean-webpack-plugin": "^3.0.0",
+    "compression-webpack-plugin": "^8.0.1",
+    "copy-webpack-plugin": "^7.0.0",
+    "css-loader": "^5.2.6",
+    "css-minimizer-webpack-plugin": "^2.0.0",
+    "dotenv-webpack": "^6.0.4",
+    "eslint": "^7.29.0",
+    "eslint-config-airbnb": "^18.2.1",
+    "eslint-config-prettier": "^7.2.0",
     "eslint-import-resolver-alias": "^1.1.2",
+    "eslint-loader": "^4.0.2",
     "eslint-plugin-babel": "^5.3.1",
-    "eslint-plugin-import": "^2.27.5",
-    "eslint-plugin-jsx-a11y": "^6.7.1",
-    "eslint-plugin-no-inline-styles": "^1.0.5",
-    "eslint-plugin-prettier": "^4.2.1",
-    "eslint-plugin-react": "^7.32.2",
-    "eslint-plugin-react-hooks": "^4.6.0",
-    "lint-staged": "^13.2.1",
-    "prettier": "^2.8.7",
-    "vite-plugin-pwa": "^0.14.7",
-    "vite-plugin-svgr": "^4.2.0",
-    "vite-tsconfig-paths": "^4.2.0"
+    "eslint-plugin-import": "^2.23.4",
+    "eslint-plugin-prettier": "^3.4.0",
+    "eslint-plugin-react": "^7.24.0",
+    "eslint-plugin-react-hooks": "^4.2.0",
+    "html-webpack-plugin": "^5.3.2",
+    "husky": "^4.3.8",
+    "lint-staged": "^11.0.0",
+    "mini-css-extract-plugin": "^1.6.1",
+    "node-sass": "^5.0.0",
+    "path": "^0.12.7",
+    "prettier": "^2.3.2",
+    "react-refresh": "^0.9.0",
+    "sass-loader": "^11.1.1",
+    "style-loader": "^2.0.0",
+    "terser-webpack-plugin": "^5.1.4",
+    "webpack": "^5.40.0",
+    "webpack-bundle-analyzer": "^4.4.2",
+    "webpack-cli": "^4.7.2",
+    "webpack-dev-server": "^3.11.2",
+    "webpack-merge": "^5.8.0"
   },
   "browserslist": {
     "production": [

public/browserconfig.xml

@@ -1,9 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<browserconfig>
-    <msapplication>
-        <tile>
-            <square150x150logo src="/mstile-150x150.png"/>
-            <TileColor>#414141</TileColor>
-        </tile>
-    </msapplication>
-</browserconfig>

public/config.json

@@ -0,0 +1,4 @@
+{
+  "DEFAULT_UCENTRALSEC_URL": "https://ucentral.dpaas.arilia.com:16001",
+  "ALLOW_UCENTRALSEC_CHANGE": false
+}