Adiciona cliente web e simulador.

cli/web/.eslintignore

+/node_modules/**
+/dist/**
+/public/**
+*.min.js
+server.js
+setEnvironment.js
+webpack.config.js
+postcss.config.ts
\ No newline at end of file

cli/web/.eslintrc.json

+{
+  "parser": "@typescript-eslint/parser",
+  "plugins": ["@typescript-eslint"],
+  "parserOptions": {
+    "project": "./tsconfig.json",
+    "sourceType": "module"
+  },
+  "rules": {
+    "@typescript-eslint/no-explicit-any": 0,
+    "@typescript-eslint/no-var-requires": 0,
+    "@typescript-eslint/no-unsafe-member-access": 0,
+    "@typescript-eslint/explicit-module-boundary-types": 0,
+    "@typescript-eslint/unbound-method": 0,
+    "@typescript-eslint/no-unsafe-assignment": 0,
+    "@typescript-eslint/restrict-template-expressions": 0,
+    "@typescript-eslint/no-non-null-assertion": 0,
+    "@typescript-eslint/no-unused-vars": 0,
+    "@typescript-eslint/no-empty-interface": 0,
+    "@typescript-eslint/no-unsafe-call": 0,
+    "@typescript-eslint/no-unsafe-return": 0,
+    "@typescript-eslint/no-empty-function": 0
+  },
+  "extends": ["eslint:recommended", "plugin:@typescript-eslint/recommended", "plugin:@typescript-eslint/recommended-requiring-type-checking"]
+}

cli/web/.gitignore

+**/node_modules
+**/lib
+*.tar.gz
+*.zip
+*.log
+*.tsbuildinfo
+.prettierrc
+example\.xml
+/dist/**
+/test/**
+/.vscode/
\ No newline at end of file

cli/web/.npmignore

+/src
+/public
+/typings
+/.vscode
+
+.prettierrc
+.babelrc
+*.png
+*.json
+*.md
+*.log
+*.tsbuildinfo

cli/web/.npmrc

+init.author.name = admin
+init.author.email = suporte@evologica.com.br
+# an email is required to publish npm packages
+email=suporte@evologica.com.br
+always-auth=true
+# _auth is a base64 encode of 'username:password'
+# if you need to generate a new one: echo -n 'username:password' | openssl base64
+_auth=YWRtaW46amo1OFBkMDI=
\ No newline at end of file

cli/web/.yarnrc

+--registry "https://registry.npmjs.org/"
+"@curio:registry" "https://nexus.dev.evologica.com.br/repository/npm"
+"@dynamo:registry" "https://nexus.dev.evologica.com.br/repository/npm"
\ No newline at end of file

cli/web/babel.config.json

+{
+  "presets": [
+    [
+      "@babel/preset-env",
+      {
+        "modules": false,
+        "corejs": {
+          "version": "3",
+          "proposals": true
+        },
+        "useBuiltIns": "usage",
+        "targets": {
+          "ie": "11",
+          "browsers": [
+            "edge >= 16",
+            "safari >= 9",
+            "firefox >= 57",
+            "ie >= 11",
+            "ios >= 9",
+            "chrome >= 49"
+          ]
+        }
+      }
+    ],
+    "@babel/preset-react"
+  ],
+  "plugins": [
+    [
+      "babel-plugin-import",
+      {
+        "libraryName": "@material-ui/core",
+        "libraryDirectory": "esm",
+        "camel2DashComponentName": false
+      },
+      "core"
+    ],
+    [
+      "babel-plugin-import",
+      {
+        "libraryName": "@material-ui/lab",
+        "libraryDirectory": "esm",
+        "camel2DashComponentName": false
+      },
+      "lab"
+    ],
+    [
+      "babel-plugin-import",
+      {
+        "libraryName": "@material-ui/icons",
+        "libraryDirectory": "esm",
+        "camel2DashComponentName": false
+      },
+      "icons"
+    ],
+    "@babel/plugin-proposal-optional-chaining",
+    "@babel/plugin-proposal-nullish-coalescing-operator",
+    "@babel/plugin-proposal-object-rest-spread",
+    "@babel/plugin-proposal-class-properties",
+    "@babel/plugin-transform-async-to-generator",
+    "@babel/plugin-syntax-dynamic-import",
+    "@babel/plugin-transform-arrow-functions"
+  ]
+}

cli/web/config/dev.json

+{
+  "service": {
+    "url": "https://srvd1.dev.evologica.com.br/cxClient/cxIsapiClient.dll/gatewayJSON?version=4",
+    "server": "192.168.0.34",
+    "system": 19,
+    "port": 9801,
+    "module": 1,
+    "version": 3
+  },
+  "accessToken": "ab4dfc4ab84517f900193f8a2530680c73ad3539f75e1f5661bee7065cfcdd32",
+  "resources": {
+    "get": "https://mdk.dev.evologica.com.br/cxClient/cxIsapiClient.dll/getpr",
+    "put": "https://mdk.dev.evologica.com.br/cxClient/cxIsapiClient.dll/putpr"
+  },
+  "logs": true
+}

cli/web/config/prod.json

+{
+  "service": {
+    "url": "https://mdk.evologica.com.br/cxClient/cxIsapiClient.dll/gatewayJSONBalanced?version=4",
+    "server": "mdk.evologica.com.br",
+    "system": 94,
+    "port": 7902
+  },
+  "accessToken": "ed296c1d9dc3d3eb41a29077bd715278cc985849e0df51da0c2653996055d19f",
+  "resources": {
+    "get": "https://mdk.dev.evologica.com.br/cxClient/cxIsapiClient.dll/getpr",
+    "put": "https://mdk.dev.evologica.com.br/cxClient/cxIsapiClient.dll/putpr"
+  },
+  "logs": true
+}

cli/web/config/staging.json

+{
+  "service": {
+    "url": "https://mdk.dev.evologica.com.br/cxClient/cxIsapiClient.dll/gatewayJSON?version=4",
+    "server": "srvp4",
+    "system": 94,
+    "port": 7901
+  },
+  "accessToken": "ab4dfc4ab84517f900193f8a2530680c73ad3539f75e1f5661bee7065cfcdd32",
+  "resources": {
+    "get": "https://mdk.dev.evologica.com.br/cxClient/cxIsapiClient.dll/getpr",
+    "put": "https://mdk.dev.evologica.com.br/cxClient/cxIsapiClient.dll/putpr"
+  },
+  "logs": true
+}

cli/web/package.json

+{
+  "name": "agiliza",
+  "version": "0.0.1",
+  "license": "ISC",
+  "repository": "https://gitlab.dev.evologica.com.br/evologica/agiliza",
+  "author": "Rafael Igor <rafaelrios@evologica.com.br>",
+  "eslintConfig": {
+    "env": {
+      "browser": true,
+      "node": true
+    }
+  },
+  "scripts": {
+    "env:dev": "node ./setEnvironment.js dev",
+    "env:prod": "node ./setEnvironment.js prod",
+    "env:staging": "node ./setEnvironment.js staging",
+    "start": "yarn env:dev && webpack-dev-server",
+    "start:staging": "yarn env:staging && webpack-dev-server",
+    "start:prod": "yarn env:prod && webpack-dev-server",
+    "serve": "ts-node ./server",
+    "build": "yarn clean && yarn test && yarn env:prod && webpack --env.production --config webpack.config.js --progress -p",
+    "build:staging": "yarn clean && yarn test && yarn env:staging && webpack --env.production --config webpack.config.js --progress -p",
+    "clean": "rimraf ./dist",
+    "test": "tsc --noEmit"
+  },
+  "devDependencies": {
+    "@babel/compat-data": "^7.8.0",
+    "@babel/core": "7.14.3",
+    "@babel/plugin-proposal-class-properties": "7.13.0",
+    "@babel/plugin-proposal-nullish-coalescing-operator": "7.14.2",
+    "@babel/plugin-proposal-object-rest-spread": "7.14.2",
+    "@babel/plugin-proposal-optional-chaining": "7.14.2",
+    "@babel/plugin-syntax-dynamic-import": "7.8.3",
+    "@babel/plugin-transform-async-to-generator": "7.13.0",
+    "@babel/preset-env": "^7.8.0",
+    "@babel/preset-react": "7.13.13",
+    "@types/classnames": "^2.2.10",
+    "@types/compression-webpack-plugin": "6.0.5",
+    "@types/copy-webpack-plugin": "8.0.0",
+    "@types/express": "4.17.11",
+    "@types/fork-ts-checker-webpack-plugin": "0.4.5",
+    "@types/html-webpack-plugin": "3.2.5",
+    "@types/mini-css-extract-plugin": "1.4.3",
+    "@types/node": "15.6.1",
+    "@types/react": "17.0.7",
+    "@types/react-dom": "17.0.5",
+    "@types/react-redux": "7.1.16",
+    "@types/react-router": "5.1.14",
+    "@types/react-router-dom": "5.1.7",
+    "@types/redux-logger": "^3.0.7",
+    "@types/webpack": "5.28.0",
+    "@types/webpack-bundle-analyzer": "4.4.0",
+    "@types/webpack-dev-server": "3.11.4",
+    "@typescript-eslint/eslint-plugin": "^4.25.0",
+    "@typescript-eslint/parser": "^4.25.0",
+    "autoprefixer": "^10.2.5",
+    "babel-eslint": "^10.1.0",
+    "babel-loader": "8.2.2",
+    "clean-webpack-plugin": "4.0.0-alpha.0",
+    "copy-webpack-plugin": "9.0.0",
+    "css-loader": "5.2.6",
+    "css-minimizer-webpack-plugin": "^3.0.0",
+    "ejs-loader": "0.5.0",
+    "eslint": "^7.27.0",
+    "eslint-plugin-react-hooks": "^4.2.0",
+    "express": "4.17.1",
+    "file-loader": "6.2.0",
+    "fork-ts-checker-webpack-plugin": "6.2.10",
+    "html-webpack-plugin": "5.3.1",
+    "mini-css-extract-plugin": "1.6.0",
+    "postcss": "^8.3.0",
+    "postcss-cli": "^8.3.1",
+    "postcss-loader": "^5.3.0",
+    "postcss-url": "^10.1.3",
+    "process": "^0.11.10",
+    "style-loader": "2.0.0",
+    "ts-loader": "9.2.2",
+    "ts-node": "10.0.0",
+    "typescript": "^4.0.0"
+  },
+  "dependencies": {
+    "@curio/client": "1.3.3",
+    "@curio/components": "^0.1.3",
+    "@curio/ui": "^0.1.0",
+    "@date-io/date-fns": "^1.0.0",
+    "@dynamo/components": "0.70.1",
+    "@dynamo/curio": "0.70.1",
+    "@dynamo/material-ui": "0.70.1",
+    "@material-ui/core": "4.11.4",
+    "@material-ui/icons": "^4.11.2",
+    "@material-ui/lab": "4.0.0-alpha.58",
+    "@material-ui/pickers": "^3.3.10",
+    "@reduxjs/toolkit": "^1.2.5",
+    "@types/react-swipeable-views": "^0.13.1",
+    "@types/react-swipeable-views-utils": "^0.13.3",
+    "@xstate/react": "^1.3.3",
+    "babel-plugin-import": "^1.13.0",
+    "bowser": "^2.11.0",
+    "classnames": "^2.2.6",
+    "core-js": "3.12.1",
+    "date-fns": "^2.11.0",
+    "deepmerge": "^4.2.2",
+    "normalizr": "^3.6.1",
+    "p-min-delay": "^4.0.0",
+    "react": "^16.0.0",
+    "react-dom": "^16.0.0",
+    "react-loading-skeleton": "^2.0.1",
+    "react-redux": "^7.2.0",
+    "react-router": "5.2.0",
+    "react-router-dom": "5.2.0",
+    "redux": "^4.0.5",
+    "redux-logger": "^3.0.6",
+    "redux-observable": "^1.2.0",
+    "reselect": "^4.0.0",
+    "rxjs": "^6.5.4",
+    "webpack": "5.37.1",
+    "webpack-cli": "^3.0.0",
+    "webpack-dev-server": "3.11.2",
+    "xstate": "^4.19.1"
+  }
+}

cli/web/postcss.config.ts

+module.exports = ({ env }) => ({
+  plugins: [
+    // [
+    //   'postcss-url',
+    //   {
+    //     filter: '**/fonts/**',
+    //     url: (asset) => asset.url
+    //     // env === 'production' ? `..${asset.url}` : `..${asset.url}`
+    //   }
+    // ],
+    require('autoprefixer'), // aplica prefixadores de acordo com a lista de browsers a serem suportados
+  ],
+})

cli/web/public/config.json

+{
+  "service": {
+    "url": "https://srvd1.dev.evologica.com.br/cxClient/cxIsapiClient.dll/gatewayJSON?version=4",
+    "server": "192.168.0.34",
+    "system": 19,
+    "port": 9801,
+    "module": 1,
+    "version": 3
+  },
+  "accessToken": "ab4dfc4ab84517f900193f8a2530680c73ad3539f75e1f5661bee7065cfcdd32",
+  "resources": {
+    "get": "https://mdk.dev.evologica.com.br/cxClient/cxIsapiClient.dll/getpr",
+    "put": "https://mdk.dev.evologica.com.br/cxClient/cxIsapiClient.dll/putpr"
+  },
+  "logs": true
+}
\ No newline at end of file

cli/web/public/fonts/Heebo/OFL.txt

+Copyright 2014 The Heebo Project Authors (https://github.com/OdedEzer/heebo)
+
+This Font Software is licensed under the SIL Open Font License, Version 1.1.
+This license is copied below, and is also available with a FAQ at:
+http://scripts.sil.org/OFL
+
+
+-----------------------------------------------------------
+SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
+-----------------------------------------------------------
+
+PREAMBLE
+The goals of the Open Font License (OFL) are to stimulate worldwide
+development of collaborative font projects, to support the font creation
+efforts of academic and linguistic communities, and to provide a free and
+open framework in which fonts may be shared and improved in partnership
+with others.
+
+The OFL allows the licensed fonts to be used, studied, modified and
+redistributed freely as long as they are not sold by themselves. The
+fonts, including any derivative works, can be bundled, embedded, 
+redistributed and/or sold with any software provided that any reserved
+names are not used by derivative works. The fonts and derivatives,
+however, cannot be released under any other type of license. The
+requirement for fonts to remain under this license does not apply
+to any document created using the fonts or their derivatives.
+
+DEFINITIONS
+"Font Software" refers to the set of files released by the Copyright
+Holder(s) under this license and clearly marked as such. This may
+include source files, build scripts and documentation.
+
+"Reserved Font Name" refers to any names specified as such after the
+copyright statement(s).
+
+"Original Version" refers to the collection of Font Software components as
+distributed by the Copyright Holder(s).
+
+"Modified Version" refers to any derivative made by adding to, deleting,
+or substituting -- in part or in whole -- any of the components of the
+Original Version, by changing formats or by porting the Font Software to a
+new environment.
+
+"Author" refers to any designer, engineer, programmer, technical
+writer or other person who contributed to the Font Software.
+
+PERMISSION & CONDITIONS
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of the Font Software, to use, study, copy, merge, embed, modify,
+redistribute, and sell modified and unmodified copies of the Font
+Software, subject to the following conditions:
+
+1) Neither the Font Software nor any of its individual components,
+in Original or Modified Versions, may be sold by itself.
+
+2) Original or Modified Versions of the Font Software may be bundled,
+redistributed and/or sold with any software, provided that each copy
+contains the above copyright notice and this license. These can be
+included either as stand-alone text files, human-readable headers or
+in the appropriate machine-readable metadata fields within text or
+binary files as long as those fields can be easily viewed by the user.
+
+3) No Modified Version of the Font Software may use the Reserved Font
+Name(s) unless explicit written permission is granted by the corresponding
+Copyright Holder. This restriction only applies to the primary font name as
+presented to the users.
+
+4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
+Software shall not be used to promote, endorse or advertise any
+Modified Version, except to acknowledge the contribution(s) of the
+Copyright Holder(s) and the Author(s) or with their explicit written
+permission.
+
+5) The Font Software, modified or unmodified, in part or in whole,
+must be distributed entirely under this license, and must not be
+distributed under any other license. The requirement for fonts to
+remain under this license does not apply to any document created
+using the Font Software.
+
+TERMINATION
+This license becomes null and void if any of the above conditions are
+not met.
+
+DISCLAIMER
+THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
+OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
+COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
+DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
+OTHER DEALINGS IN THE FONT SOFTWARE.

cli/web/public/fonts/Heebo/README.txt

+Heebo Variable Font
+===================
+
+This download contains Heebo as both a variable font and static fonts.
+
+Heebo is a variable font with this axis:
+  wght
+
+This means all the styles are contained in a single file:
+  Heebo-VariableFont_wght.ttf
+
+If your app fully supports variable fonts, you can now pick intermediate styles
+that aren’t available as static fonts. Not all apps support variable fonts, and
+in those cases you can use the static font files for Heebo:
+  static/Heebo-Thin.ttf
+  static/Heebo-ExtraLight.ttf
+  static/Heebo-Light.ttf
+  static/Heebo-Regular.ttf
+  static/Heebo-Medium.ttf
+  static/Heebo-SemiBold.ttf
+  static/Heebo-Bold.ttf
+  static/Heebo-ExtraBold.ttf
+  static/Heebo-Black.ttf
+
+Get started
+-----------
+
+1. Install the font files you want to use
+
+2. Use your app's font picker to view the font family and all the
+available styles
+
+Learn more about variable fonts
+-------------------------------
+
+  https://developers.google.com/web/fundamentals/design-and-ux/typography/variable-fonts
+  https://variablefonts.typenetwork.com
+  https://medium.com/variable-fonts
+
+In desktop apps
+
+  https://theblog.adobe.com/can-variable-fonts-illustrator-cc
+  https://helpx.adobe.com/nz/photoshop/using/fonts.html#variable_fonts
+
+Online
+
+  https://developers.google.com/fonts/docs/getting_started
+  https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Fonts/Variable_Fonts_Guide
+  https://developer.microsoft.com/en-us/microsoft-edge/testdrive/demos/variable-fonts
+
+Installing fonts
+
+  MacOS: https://support.apple.com/en-us/HT201749
+  Linux: https://www.google.com/search?q=how+to+install+a+font+on+gnu%2Blinux
+  Windows: https://support.microsoft.com/en-us/help/314960/how-to-install-or-remove-a-font-in-windows
+
+Android Apps
+
+  https://developers.google.com/fonts/docs/android
+  https://developer.android.com/guide/topics/ui/look-and-feel/downloadable-fonts
+
+License
+-------
+Please read the full license text (OFL.txt) to understand the permissions,
+restrictions and requirements for usage, redistribution, and modification.
+
+You can use them freely in your products & projects - print or digital,
+commercial or otherwise. However, you can't sell the fonts on their own.
+
+This isn't legal advice, please consider consulting a lawyer and see the full
+license for all details.

cli/web/public/fonts/Rubik/OFL.txt

+Copyright 2015 The Rubik Project Authors (https://github.com/googlefonts/rubik),
+
+This Font Software is licensed under the SIL Open Font License, Version 1.1.
+This license is copied below, and is also available with a FAQ at:
+http://scripts.sil.org/OFL
+
+
+-----------------------------------------------------------
+SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
+-----------------------------------------------------------
+
+PREAMBLE
+The goals of the Open Font License (OFL) are to stimulate worldwide
+development of collaborative font projects, to support the font creation
+efforts of academic and linguistic communities, and to provide a free and
+open framework in which fonts may be shared and improved in partnership
+with others.
+
+The OFL allows the licensed fonts to be used, studied, modified and
+redistributed freely as long as they are not sold by themselves. The
+fonts, including any derivative works, can be bundled, embedded, 
+redistributed and/or sold with any software provided that any reserved
+names are not used by derivative works. The fonts and derivatives,
+however, cannot be released under any other type of license. The
+requirement for fonts to remain under this license does not apply
+to any document created using the fonts or their derivatives.
+
+DEFINITIONS
+"Font Software" refers to the set of files released by the Copyright
+Holder(s) under this license and clearly marked as such. This may
+include source files, build scripts and documentation.
+
+"Reserved Font Name" refers to any names specified as such after the
+copyright statement(s).
+
+"Original Version" refers to the collection of Font Software components as
+distributed by the Copyright Holder(s).
+
+"Modified Version" refers to any derivative made by adding to, deleting,
+or substituting -- in part or in whole -- any of the components of the
+Original Version, by changing formats or by porting the Font Software to a
+new environment.
+
+"Author" refers to any designer, engineer, programmer, technical
+writer or other person who contributed to the Font Software.
+
+PERMISSION & CONDITIONS
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of the Font Software, to use, study, copy, merge, embed, modify,
+redistribute, and sell modified and unmodified copies of the Font
+Software, subject to the following conditions:
+
+1) Neither the Font Software nor any of its individual components,
+in Original or Modified Versions, may be sold by itself.
+
+2) Original or Modified Versions of the Font Software may be bundled,
+redistributed and/or sold with any software, provided that each copy
+contains the above copyright notice and this license. These can be
+included either as stand-alone text files, human-readable headers or
+in the appropriate machine-readable metadata fields within text or
+binary files as long as those fields can be easily viewed by the user.
+
+3) No Modified Version of the Font Software may use the Reserved Font
+Name(s) unless explicit written permission is granted by the corresponding
+Copyright Holder. This restriction only applies to the primary font name as
+presented to the users.
+
+4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
+Software shall not be used to promote, endorse or advertise any
+Modified Version, except to acknowledge the contribution(s) of the
+Copyright Holder(s) and the Author(s) or with their explicit written
+permission.
+
+5) The Font Software, modified or unmodified, in part or in whole,
+must be distributed entirely under this license, and must not be
+distributed under any other license. The requirement for fonts to
+remain under this license does not apply to any document created
+using the Font Software.
+
+TERMINATION
+This license becomes null and void if any of the above conditions are
+not met.
+
+DISCLAIMER
+THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
+OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
+COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
+DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
+OTHER DEALINGS IN THE FONT SOFTWARE.

cli/web/public/fonts/Rubik/README.txt

+Rubik Variable Font
+===================
+
+This download contains Rubik as both variable fonts and static fonts.
+
+Rubik is a variable font with this axis:
+  wght
+
+This means all the styles are contained in these files:
+  Rubik/Rubik-VariableFont_wght.ttf
+  Rubik/Rubik-Italic-VariableFont_wght.ttf
+
+If your app fully supports variable fonts, you can now pick intermediate styles
+that aren’t available as static fonts. Not all apps support variable fonts, and
+in those cases you can use the static font files for Rubik:
+  Rubik/static/Rubik-Light.ttf
+  Rubik/static/Rubik-Regular.ttf
+  Rubik/static/Rubik-Medium.ttf
+  Rubik/static/Rubik-SemiBold.ttf
+  Rubik/static/Rubik-Bold.ttf
+  Rubik/static/Rubik-ExtraBold.ttf
+  Rubik/static/Rubik-Black.ttf
+  Rubik/static/Rubik-LightItalic.ttf
+  Rubik/static/Rubik-Italic.ttf
+  Rubik/static/Rubik-MediumItalic.ttf
+  Rubik/static/Rubik-SemiBoldItalic.ttf
+  Rubik/static/Rubik-BoldItalic.ttf
+  Rubik/static/Rubik-ExtraBoldItalic.ttf
+  Rubik/static/Rubik-BlackItalic.ttf
+
+Get started
+-----------
+
+1. Install the font files you want to use
+
+2. Use your app's font picker to view the font family and all the
+available styles
+
+Learn more about variable fonts
+-------------------------------
+
+  https://developers.google.com/web/fundamentals/design-and-ux/typography/variable-fonts
+  https://variablefonts.typenetwork.com
+  https://medium.com/variable-fonts
+
+In desktop apps
+
+  https://theblog.adobe.com/can-variable-fonts-illustrator-cc
+  https://helpx.adobe.com/nz/photoshop/using/fonts.html#variable_fonts
+
+Online
+
+  https://developers.google.com/fonts/docs/getting_started
+  https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Fonts/Variable_Fonts_Guide
+  https://developer.microsoft.com/en-us/microsoft-edge/testdrive/demos/variable-fonts
+
+Installing fonts
+
+  MacOS: https://support.apple.com/en-us/HT201749
+  Linux: https://www.google.com/search?q=how+to+install+a+font+on+gnu%2Blinux
+  Windows: https://support.microsoft.com/en-us/help/314960/how-to-install-or-remove-a-font-in-windows
+
+Android Apps
+
+  https://developers.google.com/fonts/docs/android
+  https://developer.android.com/guide/topics/ui/look-and-feel/downloadable-fonts
+
+License
+-------
+Please read the full license text (OFL.txt) to understand the permissions,
+restrictions and requirements for usage, redistribution, and modification.
+
+You can use them freely in your products & projects - print or digital,
+commercial or otherwise. However, you can't sell the fonts on their own.
+
+This isn't legal advice, please consider consulting a lawyer and see the full
+license for all details.

cli/web/public/index.ejs

+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <title><%= htmlWebpackPlugin.options.title %></title>
+    <%= htmlWebpackPlugin.tags.headTags %>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script src="https://kit.fontawesome.com/a68ff73b1b.js" crossOrigin="anonymous"></script>
+  </body>
+</html>

cli/web/server.js

+const express = require('express')
+const path = require('path')
+const server = express()
+
+server.use(express.static(path.join(__dirname, 'dist')))
+
+server.get('*', (req, res) => {
+  res.sendFile(path.join(__dirname, 'dist', 'index.html'))
+})
+
+server.listen(3010, () => {
+  console.log('Listening at http://localhost:3010/')
+})

cli/web/setEnvironment.js

+#!/bin/node
+
+const fs = require('fs') //Obtain the environment string passed to the node script
+
+const environment = process.argv[2] 
+const envFileContent = require(`./config/${environment}.json`) //read the content of the json file
+
+console.log(__dirname)
+
+ //copy the json inside the env.json file
+fs.writeFileSync(`${__dirname}/public/config.json`, JSON.stringify(envFileContent, undefined, 2))

cli/web/src/__mocks__/creditLines.ts

+export const creditLines = Array.from(Array(8).keys()).map((n, i) => ({
+  id: i.toString(),
+  name: `Line ${i + 1}`,
+  amount: {
+    min: 100,
+    max: 9999,
+  },
+  paymentMonths: {
+    min: 6,
+    max: 36,
+  },
+  graceMonths: {
+    min: 4,
+    max: 24,
+  },
+  informations:
+    'Donec sit amet ante rutrum, tincidunt ante quis, semper tortor. Quisque feugiat dictum dictum. Duis scelerisque erat sollicitudin egestas pretium. Vivamus eget magna eu dui vestibulum hendrerit nec vel mi. Mauris et urna blandit, porttitor dui at, semper justo. Vestibulum elit enim, finibus in porta vitae, faucibus non lacus. Ut feugiat magna ipsum, eu scelerisque risus dignissim semper. In condimentum tortor sit amet hendrerit tempus. Cras sed ex a libero euismod aliquet.',
+}))
+
+export interface CreditLineData {
+  id: string
+  amount: number
+  graceMonths: number
+  paymentMonths: number
+  interestRate: number
+  effectiveTotalCost: number
+  openingCreditRate: number
+}
+
+export const creditLinesData: Record<string, CreditLineData> = Array.from(Array(8).keys()).reduce(
+  (cLs, cL, i) => ({
+    ...cLs,
+    [i]: {
+      id: i.toString(),
+      amount: Math.random() * 1000,
+      graceMonths: Math.ceil(Math.random() * 10),
+      paymentMonths: Math.ceil(Math.random() * 10),
+      interestRate: Math.ceil(Math.random() * 10),
+      effectiveTotalCost: Number((Math.random() * 100).toFixed(2)),
+      openingCreditRate: Math.ceil(Math.random() * 1000),
+    },
+  }),
+  {}
+)

cli/web/src/api/dynamo/index.ts

+import { getSessionManager } from '@agiliza/curio'
+
+import { System as ApiSystem } from '../interfaces/System'
+import { DYNAMO_TRANSITIONS } from '../useCases/transitions'
+
+export interface SearchParams {
+  values: Record<string, any>
+}
+
+export function createMenuAPI() {
+  return {
+    fetchMenu: async function () {
+      const sessionManger = await getSessionManager()
+      const response = await sessionManger.session!.sendRequest(DYNAMO_TRANSITIONS.menu, {
+        Level: {
+          _: sessionManger.session!.module,
+        },
+        Version: {
+          _: sessionManger.session!.version,
+        },
+      })
+      return response.System as ApiSystem
+    },
+  }
+}

cli/web/src/api/interfaces/Login.ts

+export interface SolicitarRedefinicao {
+  _cpf: string
+  _email: string
+  _login: string
+}
+
+export interface VerificarCodigo {
+  _codigoAcesso: string
+  _OID: string
+}
+
+export interface RedefinirSenha {
+  _OID: string
+  _senha: string
+  _codigoAcesso: string
+}

cli/web/src/api/interfaces/System.ts

+export interface MU {
+  _Type: 'MU'
+  _Name: string
+  _VIEW?: 'menu' // ? ver com Sandro se isso faz algum sentido sem ser menu
+  _UC: string // Use case
+  _OP: string // Operation
+}
+
+export interface MS {
+  _Type: 'MS'
+  _Name: string
+  _EN: string //Entity
+  Actions: MU[]
+}
+
+export interface MI {
+  _Type: 'MI'
+  _Name: string
+  Submenus: Menu[]
+}
+
+export type Menu = MS | MI | MU
+
+export interface System {
+  _Name: string
+  Menus: Menu[]
+}

cli/web/src/api/mappers/error.ts

+import { Action } from 'redux'
+import { of } from 'rxjs'
+
+import { actions as errorActions } from '@agiliza/redux/ui/error'
+import { getError } from '@agiliza/utils/method'
+
+export function mapErrorToActions(response: Error, ...actions: ((error: string) => Action)[]) {
+  const error = getError(response)
+
+  return of(...actions.map((a) => a(error)), errorActions.setErrorMessage(error))
+}

cli/web/src/api/mappers/index.ts

+import * as error from './error'
+
+export { error }

cli/web/src/api/mappers/system.ts

+import { normalize, schema } from 'normalizr'
+
+import { Menu as ApiMenu, System as ApiSystem } from '@agiliza/api/interfaces/System'
+import { Menu, MI, MS, MU, SystemData, SystemEntities } from '@agiliza/redux/entities/system'
+import { Operations } from '@dynamo/utils'
+
+let currentId = 0
+
+function mapOpApiToStore(operation: string): Operations {
+  switch (operation) {
+    case '1':
+      return 'create'
+    case '2':
+      return 'read'
+    case '3':
+      return 'update'
+    case '4':
+      return 'delete'
+    default:
+      return 'unknown'
+  }
+}
+
+function mapMenuApiToStore(menus: ApiMenu[]): Menu[] {
+  if (!menus) return []
+  const menuTree = menus.map((m) => {
+    if (m._Type === 'MI') {
+      return {
+        id: (++currentId).toString(),
+        name: m._Name,
+        type: 'MI',
+        submenus: mapMenuApiToStore(m.Submenus),
+      } as MI
+    } else if (m._Type === 'MS') {
+      return {
+        id: (++currentId).toString(),
+        name: m._Name,
+        entity: m._EN,
+        type: 'MS',
+        actions: mapMenuApiToStore(m.Actions),
+      } as MS
+    } else {
+      return {
+        id: (++currentId).toString(),
+        name: m._Name,
+        operation: mapOpApiToStore(m._OP),
+        type: 'MU',
+        useCase: m._UC,
+        view: m._VIEW,
+      } as MU
+    }
+  })
+  return menuTree
+}
+
+const muSchema = new schema.Entity('MU')
+const msSchema = new schema.Entity('MS', { actions: [muSchema] })
+
+const mapMenusToEntities = (menus: Menu[]) => {
+  const entities: SystemEntities = menus.reduce(
+    (acc, menu) => {
+      if (menu.type === 'MI') {
+        const ents = mapMenusToEntities(menu.submenus)
+        acc.MS = { ...acc.MS, ...ents.MS }
+        acc.MU = { ...acc.MU, ...ents.MU }
+        return acc
+      } else if (menu.type === 'MS') {
+        const { entities: ents }: { entities: SystemEntities } = normalize(menu, msSchema)
+        acc.MS = { ...acc.MS, ...ents.MS }
+        acc.MU = { ...acc.MU, ...ents.MU }
+        return acc
+      } else {
+        acc.MU[menu.id] = menu
+        return acc
+      }
+    },
+    { MS: {}, MU: {} } as SystemEntities
+  )
+  return entities
+}
+
+export function mapSystemApiToStore(system?: ApiSystem): SystemData {
+  if (!system) return {}
+  const menus = mapMenuApiToStore(system.Menus)
+
+  const entities = mapMenusToEntities(menus)
+
+  currentId = 0
+
+  return {
+    system: {
+      name: system._Name,
+      menus,
+    },
+    entities,
+  }
+}

cli/web/src/api/useCases/index.ts

+import pMinDelay from 'p-min-delay'
+
+import * as apiSession from './session'
+
+type ApiSessionManager<A> = (...args: any[]) => Promise<A | void>
+
+interface ApiMapObject<A> {
+  [key: string]: ApiSessionManager<A>
+}
+
+export const applyDelayToApi = <
+  A,
+  M extends ApiMapObject<A> | ApiSessionManager<A>
+>(
+  apiMapObject: M,
+  ms = 600
+): M =>
+  Object.entries(apiMapObject).reduce(
+    (acc, [k, v]: [string, ApiSessionManager<any>]) => ({
+      ...acc,
+      [k]: (...args: any[]) => pMinDelay(v(...args), ms)
+    }),
+    {} as M
+  )
+
+export const session = applyDelayToApi(apiSession)

cli/web/src/api/useCases/session.ts

+import { getSessionManager } from '@agiliza/curio'
+
+import { createMenuAPI } from '../dynamo'
+
+// import { createMenuAPI } from '../dynamo'
+
+// import { SolicitarRedefinicao, VerificarCodigo, RedefinirSenha } from '../interfaces/Login'
+
+// const ucRecuperarSenha = {
+//   id: '3522',
+//   SOLICITAR_REDEFINICAO: 'RM_SOLICITAR_REDEFINICAO',
+//   VERIFICAR_CODIGO: 'RM_VERIFICAR_CODIGO',
+//   DEFIINIR_SENHA: 'RM_DEFINIR_SENHA'
+// }
+
+interface LoginParams {
+  username: string
+  password: string
+}
+
+export const initialize = async () => {
+  await getSessionManager()
+}
+
+export const login = async ({ username, password }: LoginParams) => {
+  const sessionManager = await getSessionManager()
+  return sessionManager.openMainUseCase(username, password)
+}
+
+export const logout = async () => {
+  const sessionManager = await getSessionManager()
+  sessionManager?.session?.abort()
+}
+
+export const { fetchMenu } = createMenuAPI()
+
+// export const solicitarRedefinicao = async (funcionario: SolicitarRedefinicao) => {
+//   const mainUseCase = await sessionManager.anonymousConnection()
+//   const uc = await mainUseCase.openUseCase(ucRecuperarSenha.id)
+//   const response = await uc.sendRequest(ucRecuperarSenha.SOLICITAR_REDEFINICAO, {
+//     Funcionario: funcionario
+//   })
+
+//   await uc.abort()
+//   return response.Funcionario as Funcionario
+// }
+
+// const enviarCodigoSenha = async (envCodigo: VerificarCodigo) => {
+//   const { _codigoAcesso, _OID } = envCodigo
+//   const mainUseCase = await sessionManager.anonymousConnection()
+//   const uc = await mainUseCase.openUseCase(ucRecuperarSenha.id)
+//   const response = await uc.sendRequest(ucRecuperarSenha.VERIFICAR_CODIGO, {
+//     Funcionario: { _codigoAcesso, _OID }
+//   })
+//   await uc.abort()
+//   return response.Funcionario as Funcionario
+// }
+
+// const redefinirSenha = async (redefSenha: RedefinirSenha) => {
+//   const { _OID, _senha, _codigoAcesso } = redefSenha
+//   const mainUseCase = await sessionManager.anonymousConnection()
+//   const uc = await mainUseCase.openUseCase(ucRecuperarSenha.id)
+//   const response = await uc.sendRequest(ucRecuperarSenha.DEFIINIR_SENHA, {
+//     Funcionario: { _senha, _OID, _codigoAcesso }
+//   })
+//   await uc.abort()
+//   return response.Funcionario as Funcionario
+// }
+
+// export const useCaseRecuperarSenha = {
+//   solicitarRedefinicao,
+//   enviarCodigoSenha,
+//   redefinirSenha
+// }

cli/web/src/api/useCases/transitions.ts

+import { Operations } from '@dynamo/utils'
+
+export const DYNAMO_ENTITIES = {
+  TermsOfAcceptance: '1',
+  Profile: '5',
+  User: '6',
+}
+
+export const DYNAMO_TRANSITIONS = {
+  menu: '116',
+  presentation: '134',
+  search: '120',
+} as const
+
+export type DynamoMetadata = {
+  [key in Operations]?: string
+} & { useCase: number; fetch: string }
+
+export const USER_METADATA = {
+  useCase: 101,
+  save: 'RM_SALVA_OBJETO',
+  getContext: 'RM_OBTEM_CONTEXTO',
+  createObject: 'RM_INCLUI_OBJETO',
+  editObject: 'RM_EDITA_OBJETO',
+  disable: 'RM_EXCLUI_OBJETO',
+} as const
+
+export const PROFILE_METADATA = {
+  useCase: 1963,
+  save: 'RM_SALVA_OBJETO',
+  getContext: 'RM_OBTEM_CONTEXTO',
+  createObject: 'RM_INCLUI_OBJETO',
+  editObject: 'RM_EDITA_OBJETO',
+  deleteObject: 'RM_EXCLUI_OBJETO',
+  // getTransitions: 'RM_GET_TRIGGERS_FROM_CURRENT_STATE',
+} as const

cli/web/src/components/atoms/AuthRoute/index.tsx

+import React from 'react'
+import { connect } from 'react-redux'
+import { Redirect, Route, RouteProps } from 'react-router'
+
+import { StoreState } from '@agiliza/redux'
+import { isAuthenticated } from '@agiliza/redux/session/selectors'
+
+interface Props extends RouteProps {
+  authenticated: boolean
+}
+
+function AuthRoute({ authenticated, ...props }: Props) {
+  return authenticated ? <Route {...props} /> : <Redirect to="/login" />
+}
+
+const mapStateToProps = (state: StoreState) => ({
+  authenticated: isAuthenticated(state.session),
+})
+
+export default connect(mapStateToProps)(AuthRoute)

cli/web/src/components/atoms/ButtonWithProgress/ButtonWithProgress.tsx

+import React from 'react'
+
+import { Button, LinearProgress } from '@material-ui/core'
+import { ButtonProps } from '@material-ui/core/Button'
+import { withStyles, WithStyles } from '@material-ui/core/styles'
+
+import { styles } from './styles'
+
+type ExtendedTypes = WithStyles<typeof styles> &
+  Pick<ButtonProps, 'disabled' | 'onClick' | 'type' | 'children' | 'className' | 'color'>
+
+interface Props extends ExtendedTypes {
+  fetching?: boolean
+}
+
+const ButtonWithProgress = (props: Props) => {
+  const { className, classes, fetching, disabled, onClick, type, children, color = 'primary' } = props
+  return (
+    <Button
+      className={className}
+      disabled={disabled || fetching}
+      onClick={onClick}
+      variant="contained"
+      color={color}
+      type={type}
+    >
+      {fetching && <LinearProgress className={classes.progress} />}
+      {children}
+    </Button>
+  )
+}
+
+export default withStyles(styles)(ButtonWithProgress)

cli/web/src/components/atoms/ButtonWithProgress/index.ts

+export { default } from './ButtonWithProgress'
+export * from './ButtonWithProgress'

cli/web/src/components/atoms/ButtonWithProgress/styles.ts

+import { Theme, createStyles } from '@material-ui/core/styles'
+
+export const styles = (theme: Theme) => {
+  return createStyles({
+    progress: {
+      bottom: 0,
+      margin: 0,
+      width: '100%',
+      position: 'absolute'
+    }
+  })
+}

cli/web/src/components/atoms/ItemWithIcon/ItemWithIcon.tsx

+import React from 'react'
+import ListItem from '@material-ui/core/ListItem'
+import ListItemIcon from '@material-ui/core/ListItemIcon'
+import ListItemText from '@material-ui/core/ListItemText'
+
+interface Props {
+  label: string
+  className?: string
+  children: React.ReactElement
+  onClick?: () => void
+}
+
+const ItemWithIcon = (props: Props) => {
+  const { className, label, children, onClick } = props
+  return (
+    <ListItem button className={className} onClick={onClick}>
+      <ListItemIcon>{children}</ListItemIcon>
+      <ListItemText primary={label} />
+    </ListItem>
+  )
+}
+
+export default ItemWithIcon

cli/web/src/components/atoms/ItemWithIcon/index.ts

+export { default } from './ItemWithIcon'
+export * from './ItemWithIcon'

cli/web/src/components/atoms/TextFieldWithIcon/TextFieldWithIcon.tsx

+import React, { useState } from 'react'
+
+import InputAdornment from '@material-ui/core/InputAdornment'
+import TextField, { TextFieldProps } from '@material-ui/core/TextField'
+import Visibility from '@material-ui/icons/Visibility'
+import VisibilityOff from '@material-ui/icons/VisibilityOff'
+import withStyles, { WithStyles } from '@material-ui/styles/withStyles'
+
+import styles from './styles'
+
+type BaseProps = WithStyles<typeof styles> &
+  Pick<TextFieldProps, 'value' | 'onChange' | 'required' | 'label' | 'type' | 'className' | 'InputProps' | 'autoFocus'>
+
+interface Props extends BaseProps {}
+
+const TextFieldWithIcon = (props: Props) => {
+  const [isPasswordVisible, setIsPasswordVisible] = useState(false)
+  const { onChange, required, value, label, type, className, InputProps, classes, autoFocus } = props
+  return (
+    <TextField
+      autoFocus={autoFocus}
+      required={required}
+      value={value}
+      onChange={onChange}
+      label={label}
+      className={className}
+      variant="outlined"
+      type={type === 'password' ? (isPasswordVisible ? undefined : type) : type}
+      InputProps={
+        InputProps || {
+          startAdornment:
+            type === 'password' ? (
+              <InputAdornment
+                position="start"
+                onClick={() => setIsPasswordVisible(!isPasswordVisible)}
+                className={classes.inputAdorment}
+              >
+                {isPasswordVisible ? <Visibility /> : <VisibilityOff />}
+              </InputAdornment>
+            ) : null,
+        }
+      }
+    />
+  )
+}
+
+export default withStyles(styles)(TextFieldWithIcon)

cli/web/src/components/atoms/TextFieldWithIcon/index.ts

+export { default } from './TextFieldWithIcon'
+export * from './TextFieldWithIcon'

cli/web/src/components/atoms/TextFieldWithIcon/styles.ts

+import { createStyles, Theme } from '@material-ui/core/styles'
+
+export default (theme: Theme) =>
+  createStyles({
+    inputAdorment: {
+      cursor: 'pointer'
+    }
+  })

cli/web/src/components/molecules/AppBar/Toolbar.tsx

+import React from 'react'
+
+import MuiToolbar from '@material-ui/core/Toolbar'
+
+import { useStyles } from './styles'
+
+export interface ToolbarProps {
+  title?: React.ReactNode
+  actions?: React.ReactNode
+  nav?: React.ReactNode
+}
+
+export function Toolbar({ nav, title, actions }: ToolbarProps) {
+  const classes = useStyles()
+  return (
+    <MuiToolbar>
+      <div className={classes.nav}>{nav}</div>
+      {title ? <div className={classes.grow}>{title}</div> : <div className={classes.grow} />}
+      {actions}
+    </MuiToolbar>
+  )
+}

cli/web/src/components/molecules/AppBar/index.tsx

+import cn from 'classnames'
+import React, { useState } from 'react'
+
+import { Collapse, CollapseProps, Fade } from '@material-ui/core'
+import MuiAppBar, { AppBarProps as MuiAppBarProps } from '@material-ui/core/AppBar'
+import IconButton from '@material-ui/core/IconButton'
+import { createStyles, makeStyles, Theme } from '@material-ui/core/styles'
+import { Menu as DrawerIcon } from '@material-ui/icons'
+
+import { Toolbar, ToolbarProps } from './Toolbar'
+
+const useStyles = makeStyles((theme: Theme) =>
+  createStyles({
+    appBar: {
+      // position: 'fixed',
+      ...theme.mixins.toolbar,
+      background: `linear-gradient(60deg, ${theme.palette.primary.main}, ${theme.palette.primary.light})`,
+    },
+    content: {
+      ...theme.mixins.toolbar,
+      display: 'flex',
+      alignItems: 'center',
+      width: '100%',
+    },
+  })
+)
+
+type BaseType = Omit<ToolbarProps, 'classes' | 'nav'>
+
+export interface AppBarProps extends BaseType {
+  className?: string
+  position?: MuiAppBarProps['position']
+  children?: React.ReactNode
+  onNavClick?(event: React.MouseEvent<HTMLButtonElement, MouseEvent>): void
+  style?: MuiAppBarProps['style']
+}
+
+const AppBar = ({ className, position = 'static', actions, title, children, onNavClick, style }: AppBarProps) => {
+  const classes = useStyles()
+  const [fadeIn, setFadeIn] = useState(false)
+
+  const onCollapse: CollapseProps['onEntered'] = (el, isAppearing) => {
+    setFadeIn(isAppearing)
+  }
+
+  const nav = onNavClick ? (
+    <IconButton color="inherit" onClick={onNavClick}>
+      <DrawerIcon />
+    </IconButton>
+  ) : null
+  return (
+    <>
+      <MuiAppBar className={cn(classes.appBar, className)} position={position} style={style}>
+        <Toolbar title={title} actions={actions} nav={nav} />
+        {children && (
+          <Collapse appear enter in onEntered={onCollapse} timeout={400}>
+            <div>
+              <Fade in={fadeIn} enter timeout={600}>
+                <div className={classes.content}>{children}</div>
+              </Fade>
+            </div>
+          </Collapse>
+        )}
+      </MuiAppBar>
+    </>
+  )
+}
+
+export default AppBar

cli/web/src/components/molecules/AppBar/styles.ts

+import { createStyles, makeStyles, Theme } from '@material-ui/core/styles'
+
+export const useStyles = makeStyles((theme: Theme) =>
+  createStyles({
+    grow: {
+      flexGrow: 1,
+    },
+    nav: {
+      marginRight: theme.spacing(2),
+    },
+  })
+)

cli/web/src/components/molecules/CircularProgress/CircularProgress.tsx

+import cn from 'classnames'
+import React from 'react'
+
+import CircularProgressMUI from '@material-ui/core/CircularProgress'
+import Container from '@material-ui/core/Container'
+
+import { useStyles } from './styles'
+
+interface Props {
+  className?: string
+  root?: boolean
+}
+
+const CircularProgress = (props: Props) => {
+  const classes = useStyles()
+  return (
+    <Container
+      className={cn(classes.container, { [classes.allContainer]: props.root })}
+    >
+      <CircularProgressMUI className={props.className} color="secondary" />
+    </Container>
+  )
+}
+
+export default CircularProgress

cli/web/src/components/molecules/CircularProgress/index.ts

+export { default } from './CircularProgress'
+export * from './CircularProgress'

cli/web/src/components/molecules/CircularProgress/styles.ts

+import { createStyles, makeStyles, Theme } from '@material-ui/core/styles'
+
+export const useStyles = makeStyles((theme: Theme) =>
+  createStyles({
+    container: {
+      display: 'flex',
+      flex: 1,
+      justifyContent: 'center',
+      alignItems: 'center'
+    },
+    allContainer: {
+      height: '100vh'
+    }
+  })
+)

cli/web/src/components/molecules/ContextButton/ContextButton.tsx

+import React from 'react'
+import IconButton from '@material-ui/core/IconButton'
+import ListItemText from '@material-ui/core/ListItemText'
+import Menu from '@material-ui/core/Menu'
+import MenuItem from '@material-ui/core/MenuItem'
+import { MoreVert as ContextIconVertical } from '@material-ui/icons'
+
+export interface ContextItem {
+  icon?: React.ReactElement
+  label?: React.ReactNode
+  onClick?(event: React.MouseEvent<HTMLLIElement, MouseEvent>): void
+}
+
+export interface ContextButtonProps {
+  disabled?: boolean
+  menuId: string
+  className?: string
+  menuClassName?: string
+  icon?: React.ReactElement
+  menuItems: ContextItem[]
+}
+
+export default function ContextButton({ menuId, disabled, menuItems, className, menuClassName }: ContextButtonProps) {
+  const [anchorEl, setAnchorEl] = React.useState<HTMLButtonElement>(null!)
+
+  function handleClick(event: React.MouseEvent<HTMLButtonElement, MouseEvent>) {
+    setAnchorEl(event.currentTarget)
+  }
+
+  function handleClose() {
+    setAnchorEl(null!)
+  }
+
+  function handleItemClick(event: React.MouseEvent<HTMLLIElement, MouseEvent>, item: ContextItem) {
+    handleClose()
+    item.onClick && item.onClick(event)
+  }
+
+  return (
+    <>
+      <IconButton
+        disabled={disabled}
+        className={className}
+        aria-controls={menuId}
+        aria-haspopup="true"
+        onClick={handleClick}
+      >
+        <ContextIconVertical />
+      </IconButton>
+      <Menu
+        id={menuId}
+        anchorEl={anchorEl}
+        keepMounted
+        open={Boolean(anchorEl)}
+        onClose={handleClose}
+        className={menuClassName}
+      >
+        {menuItems.map((item, index) => (
+          <MenuItem key={index} onClick={(e) => handleItemClick(e, item)}>
+            {/* <ListItemIcon>{item.icon}</ListItemIcon> */}
+            <ListItemText primary={item.label} />
+          </MenuItem>
+        ))}
+      </Menu>
+    </>
+  )
+}

cli/web/src/components/molecules/ContextButton/index.ts

+export { default } from './ContextButton'
+export * from './ContextButton'

cli/web/src/components/molecules/DialogLayout/DialogLayout.tsx

+import React from 'react'
+
+// import AppBar from '@material-ui/core/AppBar'
+import AppBar from '@agiliza/components/molecules/AppBar'
+import { IconButton } from '@material-ui/core'
+import Dialog from '@material-ui/core/Dialog'
+import DialogActions from '@material-ui/core/DialogActions'
+// import Toolbar from '@material-ui/core/Toolbar'
+// import IconButton from '@material-ui/core/IconButton'
+import DialogContent from '@material-ui/core/DialogContent'
+import DialogTitle from '@material-ui/core/DialogTitle'
+import Slide from '@material-ui/core/Slide'
+import { TransitionProps } from '@material-ui/core/transitions/transition'
+import CloseIcon from '@material-ui/icons/Close'
+
+import type { DialogProps } from '@material-ui/core/Dialog'
+const Transition = React.forwardRef(function Transition(
+  props: TransitionProps & { children?: React.ReactElement<any, any> },
+  ref: React.Ref<unknown>
+) {
+  return <Slide timeout={600} direction="left" ref={ref} {...props} />
+})
+
+type BaseProps = Pick<DialogProps, 'open' | 'fullScreen' | 'className' | 'maxWidth' | 'PaperProps'>
+
+interface Props extends BaseProps {
+  onClose?(): void
+  children: React.ReactNode
+  actions?: React.ReactNode
+  title: React.ReactNode
+  contentClassName?: string
+}
+
+const DialogLayout = (props: Props) => {
+  const { open, onClose, fullScreen, children, actions, title, contentClassName, className, maxWidth, PaperProps } = props
+  return (
+    <Dialog
+      fullScreen={fullScreen}
+      open={open}
+      onClose={onClose}
+      className={className}
+      PaperProps={PaperProps}
+      TransitionComponent={Transition}
+      maxWidth={maxWidth}
+    >
+      {fullScreen ? (
+        <AppBar
+          title={title}
+          actions={
+            <IconButton edge="start" color="inherit" onClick={onClose} aria-label="close">
+              <CloseIcon />
+            </IconButton>
+          }
+        />
+      ) : null}
+      {!fullScreen ? <DialogTitle>{title}</DialogTitle> : null}
+      <DialogContent className={contentClassName}>{children}</DialogContent>
+      {!fullScreen ? <DialogActions>{actions}</DialogActions> : null}
+    </Dialog>
+  )
+}
+
+export default DialogLayout

cli/web/src/components/molecules/DialogLayout/index.ts

+export { default } from './DialogLayout'
+export * from './DialogLayout'

cli/web/src/components/molecules/DialogLayout/styles.ts

+import { Theme, createStyles } from '@material-ui/core/styles'
+
+export const styles = (theme: Theme) =>
+  createStyles({
+    appBar: { position: 'relative' },
+    title: {
+      marginLeft: theme.spacing(2),
+      flex: 1
+    }
+  })

cli/web/src/components/molecules/Drawer/Drawer.tsx

+import cn from 'classnames'
+import React from 'react'
+import { RouteComponentProps } from 'react-router'
+
+import logo from '@agiliza/public/images/logo.svg'
+import { actions as sessionActions } from '@agiliza/redux/session'
+import Divider from '@material-ui/core/Divider'
+import MUIDrawer from '@material-ui/core/Drawer'
+
+import { useStyles } from './styles'
+
+type ExtendedTypes = RouteComponentProps
+
+interface DrawerItemsProps extends ExtendedTypes {
+  listItemClassName?: string
+  toggleDrawer: () => void
+  logout: Props['logout']
+}
+
+type BaseProps = RouteComponentProps
+
+export interface Props extends BaseProps {
+  drawerOpen: boolean
+  toggleDrawer: () => void
+  logout: typeof sessionActions.logout
+  Items?: React.ComponentType<DrawerItemsProps>
+}
+
+const Drawer = (props: Props) => {
+  const { drawerOpen, toggleDrawer, Items, logout, ...routeProps } = props
+
+  const classes = useStyles()
+
+  return (
+    <MUIDrawer
+      variant="temporary"
+      open={drawerOpen}
+      className={cn(classes.drawer, {
+        [classes.drawerOpen]: drawerOpen,
+        [classes.drawerClose]: !drawerOpen,
+      })}
+      classes={{
+        paper: cn(classes.drawer, {
+          [classes.drawerOpen]: drawerOpen,
+          [classes.drawerClose]: !drawerOpen,
+        }),
+      }}
+      onBackdropClick={() => toggleDrawer()}
+    >
+      <div className={classes.header}>
+        <img src={logo} className={classes.headerLogo} alt="Camedics Logo" />
+      </div>
+      <Divider />
+      {Items ? <Items logout={logout} listItemClassName={classes.listItem} toggleDrawer={toggleDrawer} {...routeProps} /> : null}
+      {/* <DrawerItems listItemClassName={classes.listItem} toggleDrawer={toggleDrawer} {...routerProps} /> */}
+      {/* <div className={classes.grow} /> */}
+      {/* <Divider />       */}
+      {/* <div className={cn(classes.collapseContainer)} onClick={() => toggleDrawer()}>
+        <Typography className={classes.iconLabel} variant="h5">
+          <DoubleArrowIcon fontSize="large" className={cn({ [style.arrowIconOpened]: drawerOpen })} />
+          {drawerOpen ? 'Colapsar' : null}
+        </Typography>
+      </div> */}
+    </MUIDrawer>
+  )
+}
+
+export default Drawer

cli/web/src/components/molecules/Drawer/index.ts

+export { default } from './Drawer'
+export * from './Drawer'

cli/web/src/components/molecules/Drawer/styles.ts

+import { drawerWidth, toolbarHeight } from '@agiliza/constants/styles'
+import { createStyles, makeStyles, Theme } from '@material-ui/core/styles'
+
+export const useStyles = makeStyles((theme: Theme) => {
+  const drawerClosedWidth = theme.spacing(0)
+  const hover = '&:hover'
+  return createStyles({
+    grow: {
+      flexGrow: 1,
+    },
+    collapseContainer: {
+      display: 'flex',
+      justifyContent: 'center',
+      alignItems: 'center',
+      cursor: 'pointer',
+      [hover]: { backgroundColor: 'white' },
+    },
+    title: {
+      textDecoration: 'none',
+      color: 'inherit',
+    },
+    container: {
+      backgroundColor: 'white',
+      height: '100vh',
+      overflowY: 'hidden',
+      display: 'flex',
+      flexDirection: 'column',
+    },
+    contentContainer: {
+      marginLeft: drawerClosedWidth,
+      flexDirection: 'column',
+      paddingBottom: theme.spacing(3),
+      paddingLeft: 0,
+      width: `calc(100% - ${drawerClosedWidth}px)`,
+      maxHeight: `calc(100vh - ${toolbarHeight}px)`,
+      height: `calc(100vh - ${toolbarHeight}px)`,
+    },
+    drawer: {
+      position: 'fixed',
+      height: '100%',
+      // top: toolbarHeight,
+      // backgroundColor: '#fafafa',
+      zIndex: 5,
+      width: drawerClosedWidth,
+      transition: theme.transitions.create('width', {
+        easing: theme.transitions.easing.sharp,
+        duration: theme.transitions.duration.enteringScreen,
+      }),
+    },
+    drawerOpen: {
+      width: drawerWidth,
+      transition: theme.transitions.create('width', {
+        easing: theme.transitions.easing.sharp,
+        duration: theme.transitions.duration.enteringScreen,
+      }),
+      overflowX: 'hidden',
+    },
+    iconLabel: {
+      display: 'flex',
+      alignItems: 'center',
+
+      margin: '5px 0px',
+    },
+    drawerClose: {
+      transition: theme.transitions.create('width', {
+        easing: theme.transitions.easing.sharp,
+        duration: theme.transitions.duration.leavingScreen,
+      }),
+      overflowX: 'hidden',
+      width: drawerClosedWidth,
+      [theme.breakpoints.up('sm')]: {
+        width: drawerClosedWidth,
+      },
+    },
+    listItem: {
+      overflowX: 'hidden',
+      width: drawerWidth,
+      paddingLeft: theme.spacing(1.5),
+    },
+    header: {
+      display: 'flex',
+      justifyContent: 'center',
+      alignItems: 'center',
+      paddingTop: theme.spacing(1),
+      paddingBottom: theme.spacing(2),
+      height: 102,
+    },
+    headerLogo: { width: 100, height: 'auto' },
+  })
+})

cli/web/src/components/molecules/ErrorDialog/ErrorDialog.tsx

+import React, { useEffect, useState } from 'react'
+import { connect } from 'react-redux'
+import { bindActionCreators, Dispatch } from 'redux'
+
+import { StoreState } from '@agiliza/redux'
+import { actions as errorActions, selectors, State as ErrorState } from '@agiliza/redux/ui/error'
+import Button from '@material-ui/core/Button'
+import Dialog from '@material-ui/core/Dialog'
+import DialogActions from '@material-ui/core/DialogActions'
+import DialogContent from '@material-ui/core/DialogContent'
+import DialogContentText from '@material-ui/core/DialogContentText'
+import DialogTitle from '@material-ui/core/DialogTitle'
+import { withStyles } from '@material-ui/styles'
+
+import { styles } from './styles'
+
+interface Props {
+  error: ErrorState['error']
+  setError: typeof errorActions.setErrorMessage
+}
+
+const ErrorDialog = (props: Props) => {
+  const { error, setError } = props
+  const [visible, setVisible] = useState(false)
+
+  useEffect(() => {
+    if (error) setVisible(true)
+  }, [props.error])
+
+  const handleClose = () => {
+    setVisible(false)
+    setTimeout(() => {
+      setError('')
+    }, 200)
+  }
+  return (
+    <Dialog open={visible} onClose={handleClose} aria-labelledby="error-dialog" aria-describedby="error-dialog-description">
+      <DialogTitle id="error-dialog-title">Erro</DialogTitle>
+      <DialogContent>
+        <DialogContentText>{error}</DialogContentText>
+      </DialogContent>
+      <DialogActions>
+        <Button onClick={handleClose} color="primary">
+          FECHAR
+        </Button>
+      </DialogActions>
+    </Dialog>
+  )
+}
+
+const mapStateToProps = (state: StoreState) => ({
+  error: selectors.getError(state.ui.error),
+})
+
+const mapDispatchToProps = (dispatch: Dispatch) =>
+  bindActionCreators(
+    {
+      setError: errorActions.setErrorMessage,
+    },
+    dispatch
+  )
+
+export default connect(mapStateToProps, mapDispatchToProps)(withStyles(styles)(ErrorDialog))

cli/web/src/components/molecules/ErrorDialog/index.ts

+export { default } from './ErrorDialog'
+export * from './ErrorDialog'

cli/web/src/components/molecules/ErrorDialog/styles.ts

+import { Theme, createStyles } from '@material-ui/core/styles'
+
+export const styles = (theme: Theme) => createStyles({})

cli/web/src/components/molecules/PopoverVersion/PopoverVersion.tsx

+import React, { useEffect, useState } from 'react'
+
+import { ConfigService } from '@agiliza/curio/SessionManager'
+import Popover from '@material-ui/core/Popover'
+import Typography from '@material-ui/core/Typography'
+import InfoIcon from '@material-ui/icons/InfoRounded'
+import { WithStyles, withStyles } from '@material-ui/styles'
+
+import { styles } from './styles'
+
+interface Props extends WithStyles<typeof styles> {
+  service?: ConfigService
+}
+
+interface PopItem {
+  key: string
+  value?: string | number
+  underline?: boolean
+}
+
+const PopoverVersion = (props: Props) => {
+  const { classes, service } = props
+  const [popItems, setPopItems] = useState<PopItem[]>([])
+  const [anchor, setAnchor] = useState<HTMLDivElement | null>(null)
+
+  useEffect(() => {
+    let items: PopItem[] = [{ key: 'Versão', value: VERSION }]
+    if (service) {
+      items = items.concat(
+        { key: 'ISAPI', value: service?.url, underline: true },
+        { key: 'Serviço', value: service?.server },
+        { key: 'Porta', value: service?.port },
+        { key: 'Sistema', value: service?.system }
+      )
+    }
+    setPopItems(items)
+  }, [service])
+
+  const createPopItems = (items: PopItem[]) =>
+    items.map((item, i) => (
+      <Typography className={classes.msg} color="textPrimary" key={i}>
+        {`${item.key}: `}
+        {<span style={{ textDecoration: item.underline ? 'underline' : undefined }}>{item.value || ''}</span>}
+      </Typography>
+    ))
+
+  return (
+    <div className={classes.root}>
+      <div onClick={(evt) => setAnchor(evt.currentTarget)}>
+        <InfoIcon className={classes.infoBtn} color="primary" />
+      </div>
+      <Popover
+        id="version-popover"
+        open={!!anchor}
+        anchorEl={anchor}
+        onClose={() => setAnchor(null)}
+        anchorOrigin={{
+          vertical: 'top',
+          horizontal: 'left',
+        }}
+        transformOrigin={{
+          vertical: 'bottom',
+          horizontal: 'right',
+        }}
+      >
+        <div className={classes.popoverContent}>{createPopItems(popItems)}</div>
+      </Popover>
+    </div>
+  )
+}
+export default withStyles(styles)(PopoverVersion)

cli/web/src/components/molecules/PopoverVersion/index.ts

+export { default } from './PopoverVersion'
+export * from './PopoverVersion'

cli/web/src/components/molecules/PopoverVersion/styles.ts

+import { createStyles, Theme } from '@material-ui/core/styles'
+
+export const styles = (theme: Theme) =>
+  createStyles({
+    root: { position: 'fixed', bottom: theme.spacing(5), right: theme.spacing(5) },
+    popoverContent: { padding: theme.spacing(1.5) },
+    msg: {
+      fontWeight: 'bold',
+      fontSize: '100%',
+      overflowWrap: 'normal',
+      // fontFamily: '"Permanent Marker", cursive'
+    },
+    infoBtn: { fontSize: 50, cursor: 'pointer' },
+  })

cli/web/src/components/particles/Icons/BellIcon.tsx

+import React from 'react'
+
+import { SvgIcon } from '@material-ui/core'
+
+interface Props {}
+
+export function BellIcon(props: Props) {
+  return (
+    <SvgIcon
+      {...props}
+      style={{
+        width: 21,
+        height: 21,
+      }}
+      viewBox="0 0 21 21"
+    >
+      <svg
+        aria-hidden="true"
+        focusable="false"
+        data-prefix="fas"
+        data-icon="bell"
+        className="svg-inline--fa fa-bell fa-w-14"
+        role="img"
+        xmlns="http://www.w3.org/2000/svg"
+        viewBox="0 0 448 512"
+      >
+        <path
+          fill="currentColor"
+          d="M224 512c35.32 0 63.97-28.65 63.97-64H160.03c0 35.35 28.65 64 63.97 64zm215.39-149.71c-19.32-20.76-55.47-51.99-55.47-154.29 0-77.7-54.48-139.9-127.94-155.16V32c0-17.67-14.32-32-31.98-32s-31.98 14.33-31.98 32v20.84C118.56 68.1 64.08 130.3 64.08 208c0 102.3-36.15 133.53-55.47 154.29-6 6.45-8.66 14.16-8.61 21.71.11 16.4 12.98 32 32.1 32h383.8c19.12 0 32-15.6 32.1-32 .05-7.55-2.61-15.27-8.61-21.71z"
+        ></path>
+      </svg>
+    </SvgIcon>
+  )
+}