Skip to content
Snippets Groups Projects
Commit bf1f4af3 authored by Erlend Ydse's avatar Erlend Ydse
Browse files

Merge branch 'dev' into 'master' 

Sprint 1 release

See merge request erlenyd/mysql-query-profiler!29
parents b9208eae 582906b6
No related branches found
No related tags found
No related merge requests found
Show whitespace changes
Inline Side-by-side
Showing
with 495 additions and 763 deletions
.editorconfig deleted 100644 → 0
+ 0
− 12
View file @ b9208eae
root = true
[*]
indent_style = space
indent_size = 2
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true
[*.md]
trim_trailing_whitespace = false
.eslintrc.js
+ 7
− 0
View file @ bf1f4af3
...@@ -3,6 +3,13 @@ module.exports = { ...@@ -3,6 +3,13 @@ module.exports = {
rules: { rules: {
// A temporary hack related to IDE not resolving correct package.json // A temporary hack related to IDE not resolving correct package.json
'import/no-extraneous-dependencies': 'off', 'import/no-extraneous-dependencies': 'off',
'no-console': 'off',
'prettier/prettier': [
'error',
{
endOfLine: 'auto',
},
],
}, },
parserOptions: { parserOptions: {
ecmaVersion: 2020, ecmaVersion: 2020,
......
.gitignore
+ 25
− 0
View file @ bf1f4af3
loginDetails.json
*.LICENSE
# Logs # Logs
logs logs
*.log *.log
...@@ -48,3 +52,24 @@ npm-debug.log.* ...@@ -48,3 +52,24 @@ npm-debug.log.*
*.css.d.ts *.css.d.ts
*.sass.d.ts *.sass.d.ts
*.scss.d.ts *.scss.d.ts
### Vim ###
# Swap
[._]*.s[a-v][a-z]
!*.svg # comment out if you don't need vector files
[._]*.sw[a-p]
[._]s[a-rt-v][a-z]
[._]ss[a-gi-z]
[._]sw[a-p]
# Session
Session.vim
Sessionx.vim
# Temporary
.netrwhist
*~
# Auto-generated tag files
tags
# Persistent undo
[._]*.un~
.gitlab-ci.yml 0 → 100644
+ 37
− 0
View file @ bf1f4af3
image: node:lts-alpine
stages:
- pre
- test
cache:
key: ${CI_COMMIT_REF_SLUG}
paths:
- node_modules/
before_script:
- yarn install
- yarn build-main
- yarn build-renderer
lint:
stage: test
script:
- yarn run lint
#lint:types:
# stage: test
# script:
# - npm run typecheck
tests:unit:
stage: test
script:
- yarn run test
#expo-deployments:
# stage: deploy
# only:
# - master
# script:
# - echo fs.inotify.max_user_watches=524288 | tee -a /etc/sysctl.conf && sysctl -p
# - npx expo login -u $EXPO_USERNAME -p $EXPO_PASSWORD
# - npx expo publish --non-interactive
.prettierrc 0 → 100644
+ 7
− 0
View file @ bf1f4af3
{
"trailingComma": "es5",
"tabWidth": 2,
"semi": false,
"singleQuote": true,
"endOfLine": "auto"
}
.vscode/extensions.json
+ 7
− 1
View file @ bf1f4af3
{ {
"recommendations": [ "recommendations": [
"dbaeumer.vscode-eslint", "dbaeumer.vscode-eslint",
"EditorConfig.EditorConfig" "EditorConfig.EditorConfig",
"esbenp.prettier-vscode",
"hwencc.html-tag-wrapper",
"coenraads.bracket-pair-colorizer",
"ms-vscode.vscode-typescript-tslint-plugin",
"visualstudioexptteam.vscodeintellicode",
"wayou.vscode-todo-highlight"
] ]
} }
.vscode/settings.json
+ 2
− 1
View file @ bf1f4af3
...@@ -26,5 +26,6 @@ ...@@ -26,5 +26,6 @@
"test/**/__snapshots__": true, "test/**/__snapshots__": true,
"yarn.lock": true, "yarn.lock": true,
"*.{css,sass,scss}.d.ts": true "*.{css,sass,scss}.d.ts": true
} },
"editor.tabSize": 2
} }
CHANGELOG.md deleted 100644 → 0
+ 0
− 486
View file @ b9208eae
# 1.3.0
- Fixes E2E tests ([#2516](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/2516))
- Fixes preload entrypoint ([#2503](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/2503))
- Downgrade to `electron@8`
- Bump dependencies to latest semver
# 1.2.0
- Migrate to redux toolkit
- Lazy load routes with react suspense
- Drop support for azure-pipelines and use only github actions
- Bump all deps to latest semver
- Remove `test-e2e` script from tests (blocked on release of https://github.com/DevExpress/testcafe-browser-provider-electron/pull/65)
- Swap `typed-css-modules-webpack-plugin` for `typings-for-css-modules-loader`
- Use latest version of `eslint-config-erb`
- Remove unnecessary file extensions from ts exclude
- Add experimental support for vscode debugging
- Revert https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/2365 as default for users, provide as opt in option
# 1.1.0
- Fix #2402
- Simplify configs (https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/2406)
# 1.0.0
- Migrate to TypeScript from Flow ([#2363](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/2363))
- Use browserslist for `@babel/preset-env` targets ([#2368](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/2368))
- Use preload script, disable `nodeIntegration` in renderer process for [improved security](https://www.electronjs.org/docs/tutorial/security#2-do-not-enable-nodejs-integration-for-remote-content) ([#2365](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/2365))
- Add support for azure pipelines ([#2369](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/2369))
- Disable sourcemaps in production
# 0.18.1 (2019.12.12)
- Fix HMR env bug ([#2343](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/2343))
- Bump all deps to latest semver
- Bump to `electron@7`
# 0.18.0 (2019.11.19)
- Bump electron to `electron@6` (`electron@7` introduces breaking changes to testcafe end to end tests)
- Revert back to [two `package.json` structure](https://www.electron.build/tutorials/two-package-structure)
- Bump all deps to latest semver
# 0.17.1 (2018.11.20)
- Fix `yarn test-e2e` and testcafe for single package.json structure
- Fixes incorrect path in `yarn start` script
- Bumped deps
- Bump g++ in travis
- Change clone arguments to clone only master
- Change babel config to target current electron version
For full change list, see https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/2021
# 0.17.0 (2018.10.30)
- upgraded to `babel@7` (thanks to @vikr01 🎉🎉🎉)
- migrated from [two `package.json` structure](https://www.electron.build/tutorials/two-package-structure) (thanks to @HyperSprite!)
- initial auto update support (experimental)
- migrate from greenkeeper to [renovate](https://renovatebot.com)
- added issue template
- use `babel-preset-env` to target current electron version
- add [opencollective](https://opencollective.com/electron-react-boilerplate-594) banner message display in postinstall script (help support ERB 🙏)
- fix failing ci issues
# 0.16.0 (2018.10.3)
- removed unused dependencies
- migrate from `react-redux-router` to `connect-react-router`
- move webpack configs to `./webpack` dir
- use `g++` on travis when testing linux
- migrate from `spectron` to `testcafe` for e2e tests
- add linting support for config styles
- changed stylelint config
- temporarily disabled flow in appveyor to make ci pass
- added necessary infra to publish releases from ci
# 0.15.0 (2018.8.25)
- Performance: cache webpack uglify results
- Feature: add start minimized feature
- Feature: lint and fix styles with prettier and stylelint
- Feature: add greenkeeper support
# 0.14.0 (2018.5.24)
- Improved CI timings
- Migrated README commands to yarn from npm
- Improved vscode config
- Updated all dependencies to latest semver
- Fix `electron-rebuild` script bug
- Migrated to `mini-css-extract-plugin` from `extract-text-plugin`
- Added `optimize-css-assets-webpack-plugin`
- Run `prettier` on json, css, scss, and more filetypes
# 0.13.3 (2018.5.24)
- Add git precommit hook, when git commit will use `prettier` to format git add code
- Add format code function in `lint-fix` npm script which can use `prettier` to format project js code
# 0.13.2 (2018.1.31)
- Hot Module Reload (HMR) fixes
- Bumped all dependencies to latest semver
- Prevent error propagation of `CheckNativeDeps` script
# 0.13.1 (2018.1.13)
- Hot Module Reload (HMR) fixes
- Bumped all dependencies to latest semver
- Fixed electron-rebuild script
- Fixed tests scripts to run on all platforms
- Skip redux logs in console in test ENV
# 0.13.0 (2018.1.6)
#### Additions
- Add native dependencies check on postinstall
- Updated all dependencies to latest semver
# 0.12.0 (2017.7.8)
#### Misc
- Removed `babel-polyfill`
- Renamed and alphabetized npm scripts
#### Breaking
- Changed node dev `__dirname` and `__filename` to node built in fn's (https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/1035)
- Renamed `app/bundle.js` to `app/renderer.prod.js` for consistency
- Renamed `dll/vendor.js` to `dll/renderer.dev.dll.js` for consistency
#### Additions
- Enable node_modules cache on CI
# 0.11.2 (2017.5.1)
Yay! Another patch release. This release mostly includes refactorings and router bug fixes. Huge thanks to @anthonyraymond!
⚠️ Windows electron builds are failing because of [this issue](https://github.com/electron/electron/issues/9321). This is not an issue with the boilerplate ⚠️
#### Breaking
- **Renamed `./app/main.development.js` => `./app/main.{dev,prod}.js`:** [#963](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/963)
#### Fixes
- **Fixed reloading when not on `/` path:** [#958](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/958) [#949](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/949)
#### Additions
- **Added support for stylefmt:** [#960](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/960)
# 0.11.1 (2017.4.23)
You can now debug the production build with devtools like so:
```
DEBUG_PROD=true npm run package
```
🎉🎉🎉
#### Additions
- **Added support for debugging production build:** [#fab245a](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/941/commits/fab245a077d02a09630f74270806c0c534a4ff95)
#### Bug Fixes
- **Fixed bug related to importing native dependencies:** [#933](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/933)
#### Improvements
- **Updated all deps to latest semver**
# 0.11.0 (2017.4.19)
Here's the most notable changes since `v0.10.0`. Its been about a year since a release has been pushed. Expect a new release to be published every 3-4 weeks.
#### Breaking Changes
- **Dropped support for node < 6**
- **Refactored webpack config files**
- **Migrate to two-package.json project structure**
- **Updated all devDeps to latest semver**
- **Migrated to Jest:** [#768](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/768)
- **Migrated to `react-router@4`**
- **Migrated to `electron-builder@4`**
- **Migrated to `webpack@2`**
- **Migrated to `react-hot-loader@3`**
- **Changed default live reload server PORT to `1212` from `3000`**
#### Additions
- **Added support for Yarn:** [#451](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/451)
- **Added support for Flow:** [#425](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/425)
- **Added support for stylelint:** [#911](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/911)
- **Added support for electron-builder:** [#876](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/876)
- **Added optional support for SASS:** [#880](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/880)
- **Added support for eslint-plugin-flowtype:** [#911](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/911)
- **Added support for appveyor:** [#280](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/280)
- **Added support for webpack dlls:** [#860](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/860)
- **Route based code splitting:** [#884](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/884)
- **Added support for Webpack Bundle Analyzer:** [#922](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/922)
#### Improvements
- **Parallelize renderer and main build processes when running `npm run build`**
- **Dynamically generate electron app menu**
- **Improved vscode integration:** [#856](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/856)
#### Bug Fixes
- **Fixed hot module replacement race condition bug:** [#917](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/917) [#920](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/920)
# 0.10.0 (2016.4.18)
#### Improvements
- **Use Babel in main process with Webpack build:** [#201](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/201)
- **Change targets to built-in support by webpack:** [#197](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/197)
- **use es2015 syntax for webpack configs:** [#195](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/195)
- **Open application when webcontent is loaded:** [#192](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/192)
- **Upgraded dependencies**
#### Bug fixed
- **Fix `npm list electron-prebuilt` in package.js:** [#188](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/188)
# 0.9.0 (2016.3.23)
#### Improvements
- **Added [redux-logger](https://github.com/fcomb/redux-logger)**
- **Upgraded [react-router-redux](https://github.com/reactjs/react-router-redux) to v4**
- **Upgraded dependencies**
- **Added `npm run dev` command:** [#162](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/162)
- **electron to v0.37.2**
#### Breaking Changes
- **css module as default:** [#154](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/154).
- **set default NODE_ENV to production:** [#140](https://github.com/electron-react-boilerplate/electron-react-boilerplate/issues/140)
# 0.8.0 (2016.2.17)
#### Bug fixed
- **Fix lint errors**
- **Fix Webpack publicPath for production builds**: [#119](https://github.com/electron-react-boilerplate/electron-react-boilerplate/issues/119).
- **package script now chooses correct OS icon extension**
#### Improvements
- **babel 6**
- **Upgrade Dependencies**
- **Enable CSS source maps**
- **Add json-loader**: [#128](https://github.com/electron-react-boilerplate/electron-react-boilerplate/issues/128).
- **react-router 2.0 and react-router-redux 3.0**
# 0.7.1 (2015.12.27)
#### Bug fixed
- **Fixed npm script on windows 10:** [#103](https://github.com/electron-react-boilerplate/electron-react-boilerplate/issues/103).
- **history and react-router version bump**: [#109](https://github.com/electron-react-boilerplate/electron-react-boilerplate/issues/109), [#110](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/110).
#### Improvements
- **electron 0.36**
# 0.7.0 (2015.12.16)
#### Bug fixed
- **Fixed process.env.NODE_ENV variable in webpack:** [#74](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/74).
- **add missing object-assign**: [#76](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/76).
- **packaging in npm@3:** [#77](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/77).
- **compatibility in windows:** [#100](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/100).
- **disable chrome debugger in production env:** [#102](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/102).
#### Improvements
- **redux**
- **css-modules**
- **upgrade to react-router 1.x**
- **unit tests**
- **e2e tests**
- **travis-ci**
- **upgrade to electron 0.35.x**
- **use es2015**
- **check dev engine for node and npm**
# 0.6.5 (2015.11.7)
#### Improvements
- **Bump style-loader to 0.13**
- **Bump css-loader to 0.22**
# 0.6.4 (2015.10.27)
#### Improvements
- **Bump electron-debug to 0.3**
# 0.6.3 (2015.10.26)
#### Improvements
- **Initialize ExtractTextPlugin once:** [#64](https://github.com/electron-react-boilerplate/electron-react-boilerplate/issues/64).
# 0.6.2 (2015.10.18)
#### Bug fixed
- **Babel plugins production env not be set properly:** [#57](https://github.com/electron-react-boilerplate/electron-react-boilerplate/issues/57).
# 0.6.1 (2015.10.17)
#### Improvements
- **Bump electron to v0.34.0**
# 0.6.0 (2015.10.16)
#### Breaking Changes
- **From react-hot-loader to react-transform**
# 0.5.2 (2015.10.15)
#### Improvements
- **Run tests with babel-register:** [#29](https://github.com/electron-react-boilerplate/electron-react-boilerplate/issues/29).
# 0.5.1 (2015.10.12)
#### Bug fixed
- **Fix #51:** use `path.join(__dirname` instead of `./`.
# 0.5.0 (2015.10.11)
#### Improvements
- **Simplify webpack config** see [#50](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/50).
#### Breaking Changes
- **webpack configs**
- **port changed:** changed default port from 2992 to 3000.
- **npm scripts:** remove `start-dev` and `dev-server`. rename `hot-dev-server` to `hot-server`.
# 0.4.3 (2015.9.22)
#### Bug fixed
- **Fix #45 zeromq crash:** bump version of `electron-prebuilt`.
# 0.4.2 (2015.9.15)
#### Bug fixed
- **run start-hot breaks chrome refresh(CTRL+R) (#42)**: bump `electron-debug` to `0.2.1`
# 0.4.1 (2015.9.11)
#### Improvements
- **use electron-prebuilt version for packaging (#33)**
# 0.4.0 (2015.9.5)
#### Improvements
- **update dependencies**
# 0.3.0 (2015.8.31)
#### Improvements
- **eslint-config-airbnb**
# 0.2.10 (2015.8.27)
#### Features
- **custom placeholder icon**
#### Improvements
- **electron-renderer as target:** via [webpack-target-electron-renderer](https://github.com/chentsulin/webpack-target-electron-renderer)
# 0.2.9 (2015.8.18)
#### Bug fixed
- **Fix hot-reload**
# 0.2.8 (2015.8.13)
#### Improvements
- **bump electron-debug**
- **babelrc**
- **organize webpack scripts**
# 0.2.7 (2015.7.9)
#### Bug fixed
- **defaultProps:** fix typos.
# 0.2.6 (2015.7.3)
#### Features
- **menu**
#### Bug fixed
- **package.js:** include webpack build.
# 0.2.5 (2015.7.1)
#### Features
- **NPM Script:** support multi-platform
- **package:** `--all` option
# 0.2.4 (2015.6.9)
#### Bug fixed
- **Eslint:** typo, [#17](https://github.com/electron-react-boilerplate/electron-react-boilerplate/issues/17) and improve `.eslintrc`
# 0.2.3 (2015.6.3)
#### Features
- **Package Version:** use latest release electron version as default
- **Ignore Large peerDependencies**
#### Bug fixed
- **Npm Script:** typo, [#6](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/6)
- **Missing css:** [#7](https://github.com/electron-react-boilerplate/electron-react-boilerplate/pull/7)
# 0.2.2 (2015.6.2)
#### Features
- **electron-debug**
#### Bug fixed
- **Webpack:** add `.json` and `.node` to extensions for imitating node require.
- **Webpack:** set `node_modules` to externals for native module support.
# 0.2.1 (2015.5.30)
#### Bug fixed
- **Webpack:** #1, change build target to `atom`.
# 0.2.0 (2015.5.30)
#### Features
- **Ignore:** `test`, `tools`, `release` folder and devDependencies in `package.json`.
- **Support asar**
- **Support icon**
# 0.1.0 (2015.5.27)
#### Features
- **Webpack:** babel, react-hot, ...
- **Flux:** actions, api, components, containers, stores..
- **Package:** darwin (osx), linux and win32 (windows) platform.
LICENSE deleted 100644 → 0
+ 0
− 21
View file @ b9208eae
The MIT License (MIT)
Copyright (c) 2015-present Electron React Boilerplate
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
README.md
+ 10
− 144
View file @ bf1f4af3
<img src="internals/img/erb-banner.png" width="100%" /> # MySQL Query Profiler
<br> ## Requirements
<p> - Node 10 or later
Electron React Boilerplate uses <a href="https://electron.atom.io/">Electron</a>, <a href="https://facebook.github.io/react/">React</a>, <a href="https://github.com/reactjs/redux">Redux</a>, <a href="https://github.com/reactjs/react-router">React Router</a>, <a href="https://webpack.github.io/docs/">Webpack</a> and <a href="https://github.com/gaearon/react-hot-loader">React Hot Loader</a> for rapid application development (HMR). - Npm
</p> - Yarn
<br>
<div align="center">
<a href="https://facebook.github.io/react/"><img src="./internals/img/react-padded-90.png" /></a>
<a href="https://webpack.github.io/"><img src="./internals/img/webpack-padded-90.png" /></a>
<a href="https://redux.js.org/"><img src="./internals/img/redux-padded-90.png" /></a>
<a href="https://github.com/ReactTraining/react-router"><img src="./internals/img/react-router-padded-90.png" /></a>
<a href="https://eslint.org/"><img src="./internals/img/eslint-padded-90.png" /></a>
<a href="https://facebook.github.io/jest/"><img src="./internals/img/jest-padded-90.png" /></a>
<a href="https://yarnpkg.com/"><img src="./internals/img/yarn-padded-90.png" /></a>
</div>
<hr />
<br />
<div align="center">
[![Build Status][github-actions-status]][github-actions-url]
[![Dependency Status][david-image]][david-url]
[![DevDependency Status][david-dev-image]][david-dev-url]
[![Github Tag][github-tag-image]][github-tag-url]
[![Join the community on Spectrum](https://withspectrum.github.io/badge/badge.svg)](https://spectrum.chat/electron-react-blpt)
[![OpenCollective](https://opencollective.com/electron-react-boilerplate/backers/badge.svg)](#backers)
[![OpenCollective](https://opencollective.com/electron-react-boilerplate/sponsors/badge.svg)](#sponsors)
[![Good first issues open][good-first-issue-image]][good-first-issue-url]
[![StackOverflow][stackoverflow-img]][stackoverflow-url]
</div>
## Install ## Install
- **If you have installation or compilation issues with this project, please see [our debugging guide](https://github.com/electron-react-boilerplate/electron-react-boilerplate/issues/400)**
First, clone the repo via git and install dependencies: First, clone the repo via git and install dependencies:
```bash ```bash
git clone --depth 1 --single-branch https://github.com/electron-react-boilerplate/electron-react-boilerplate.git your-project-name git clone [project link]
cd your-project-name cd mysql-query-profiler
yarn yarn
``` ```
Test database: [test_db](https://github.com/datacharmer/test_db)
## Starting Development ## Starting Development
Start the app in the `dev` environment. This starts the renderer process in [**hot-module-replacement**](https://webpack.js.org/guides/hmr-react/) mode and starts a webpack dev server that sends hot updates to the renderer process: Start the app in the `dev` environment. This starts the renderer process in [**hot-module-replacement**](https://webpack.js.org/guides/hmr-react/) mode and starts a webpack dev server that sends hot updates to the renderer process:
...@@ -64,108 +34,4 @@ To package apps for the local platform: ...@@ -64,108 +34,4 @@ To package apps for the local platform:
yarn package yarn package
``` ```
## Docs See the scripts in package.json for more packaging options.
See our [docs and guides here](https://electron-react-boilerplate.js.org/docs/installation)
## Donations
**Donations will ensure the following:**
- 🔨 Long term maintenance of the project
- 🛣 Progress on the [roadmap](https://electron-react-boilerplate.js.org/docs/roadmap)
- 🐛 Quick responses to bug reports and help requests
## Backers
Support us with a monthly donation and help us continue our activities. [[Become a backer](https://opencollective.com/electron-react-boilerplate#backer)]
<a href="https://opencollective.com/electron-react-boilerplate/backer/0/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/backer/0/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/backer/1/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/backer/1/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/backer/2/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/backer/2/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/backer/3/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/backer/3/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/backer/4/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/backer/4/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/backer/5/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/backer/5/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/backer/6/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/backer/6/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/backer/7/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/backer/7/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/backer/8/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/backer/8/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/backer/9/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/backer/9/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/backer/10/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/backer/10/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/backer/11/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/backer/11/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/backer/12/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/backer/12/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/backer/13/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/backer/13/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/backer/14/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/backer/14/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/backer/15/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/backer/15/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/backer/16/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/backer/16/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/backer/17/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/backer/17/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/backer/18/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/backer/18/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/backer/19/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/backer/19/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/backer/20/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/backer/20/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/backer/21/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/backer/21/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/backer/22/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/backer/22/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/backer/23/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/backer/23/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/backer/24/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/backer/24/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/backer/25/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/backer/25/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/backer/26/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/backer/26/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/backer/27/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/backer/27/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/backer/28/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/backer/28/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/backer/29/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/backer/29/avatar.svg"></a>
## Sponsors
Become a sponsor and get your logo on our README on Github with a link to your site. [[Become a sponsor](https://opencollective.com/electron-react-boilerplate-594#sponsor)]
<a href="https://opencollective.com/electron-react-boilerplate/sponsor/0/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/sponsor/0/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/sponsor/1/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/sponsor/1/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/sponsor/2/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/sponsor/2/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/sponsor/3/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/sponsor/3/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/sponsor/4/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/sponsor/4/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/sponsor/5/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/sponsor/5/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/sponsor/6/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/sponsor/6/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/sponsor/7/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/sponsor/7/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/sponsor/8/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/sponsor/8/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/sponsor/9/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/sponsor/9/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/sponsor/10/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/sponsor/10/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/sponsor/11/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/sponsor/11/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/sponsor/12/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/sponsor/12/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/sponsor/13/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/sponsor/13/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/sponsor/14/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/sponsor/14/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/sponsor/15/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/sponsor/15/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/sponsor/16/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/sponsor/16/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/sponsor/17/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/sponsor/17/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/sponsor/18/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/sponsor/18/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/sponsor/19/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/sponsor/19/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/sponsor/20/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/sponsor/20/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/sponsor/21/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/sponsor/21/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/sponsor/22/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/sponsor/22/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/sponsor/23/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/sponsor/23/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/sponsor/24/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/sponsor/24/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/sponsor/25/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/sponsor/25/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/sponsor/26/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/sponsor/26/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/sponsor/27/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/sponsor/27/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/sponsor/28/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/sponsor/28/avatar.svg"></a>
<a href="https://opencollective.com/electron-react-boilerplate/sponsor/29/website" target="_blank"><img src="https://opencollective.com/electron-react-boilerplate/sponsor/29/avatar.svg"></a>
## Maintainers
- [Amila Welihinda](https://github.com/amilajack)
- [John Tran](https://github.com/jooohhn)
- [C. T. Lin](https://github.com/chentsulin)
- [Jhen-Jie Hong](https://github.com/jhen0409)
## License
MIT © [Electron React Boilerplate](https://github.com/electron-react-boilerplate)
[github-actions-status]: https://github.com/electron-react-boilerplate/electron-react-boilerplate/workflows/Test/badge.svg
[github-actions-url]: https://github.com/electron-react-boilerplate/electron-react-boilerplate/actions
[github-tag-image]: https://img.shields.io/github/tag/electron-react-boilerplate/electron-react-boilerplate.svg?label=version
[github-tag-url]: https://github.com/electron-react-boilerplate/electron-react-boilerplate/releases/latest
[stackoverflow-img]: https://img.shields.io/badge/stackoverflow-electron_react_boilerplate-blue.svg
[stackoverflow-url]: https://stackoverflow.com/questions/tagged/electron-react-boilerplate
[david-image]: https://img.shields.io/david/electron-react-boilerplate/electron-react-boilerplate.svg
[david-url]: https://david-dm.org/electron-react-boilerplate/electron-react-boilerplate
[david-dev-image]: https://img.shields.io/david/dev/electron-react-boilerplate/electron-react-boilerplate.svg?label=devDependencies
[david-dev-url]: https://david-dm.org/electron-react-boilerplate/electron-react-boilerplate?type=dev
[good-first-issue-image]: https://img.shields.io/github/issues/electron-react-boilerplate/electron-react-boilerplate/good%20first%20issue.svg?label=good%20first%20issues
[good-first-issue-url]: https://github.com/electron-react-boilerplate/electron-react-boilerplate/issues?q=is%3Aopen+is%3Aissue+label%3A"good+first+issue"
app/.testcafe-electron-rc deleted 100644 → 0
+ 0
− 4
View file @ b9208eae
{
"mainWindowUrl": "./app.html",
"appPath": "."
}
app/App.tsx 0 → 100644
+ 71
− 0
View file @ bf1f4af3
import React from 'react';
import { createMuiTheme, ThemeProvider } from '@material-ui/core';
import { HashRouter as Router, Switch, Route } from 'react-router-dom';
import { SqlManagerProvider } from './context/SqlManagerContext';
import { LoadingProvider } from './context/LoadingContext';
import routes from './routes';
import LoginScreen from './containers/LoginScreen';
import Dashboard from './containers/Dashboard';
import { LoginDetailsProvider } from './context/LoginDetailsContext';
const theme = createMuiTheme({
palette: {
type: 'dark',
primary: {
light: '#769CFF',
main: '#769CFF',
contrastText: '#FFFFFF',
},
text: {
primary: 'rgba(255, 255, 255, 0,9)',
secondary: 'rgba(255, 255, 255, 0,8)',
disabled: 'rgba(255, 255, 255, 0,6)',
},
background: {
default: '#404040', // Dark 2
paper: '#4B4B4B', // Dark 3
},
},
typography: {
fontFamily: ['Raleway', 'Arial'].join(','),
button: {
textTransform: 'capitalize',
},
},
spacing: 8,
props: {
MuiInputBase: {
margin: 'dense',
},
MuiInputLabel: {
margin: 'dense',
},
},
});
export default function App() {
return (
<div>
<ThemeProvider theme={theme}>
<SqlManagerProvider>
<LoadingProvider>
<LoginDetailsProvider>
<div className="content">
<Router>
<Switch>
<Route exact path={routes.login}>
<LoginScreen />
</Route>
<Route path={routes.dashboard}>
<Dashboard />
</Route>
</Switch>
</Router>
</div>
</LoginDetailsProvider>
</LoadingProvider>
</SqlManagerProvider>
</ThemeProvider>
</div>
);
}
app/Routes.tsx deleted 100644 → 0
+ 0
− 28
View file @ b9208eae
/* eslint react/jsx-props-no-spreading: off */
import React from 'react';
import { Switch, Route } from 'react-router-dom';
import routes from './constants/routes.json';
import App from './containers/App';
import HomePage from './containers/HomePage';
// Lazily load routes and code split with webpack
const LazyCounterPage = React.lazy(() =>
import(/* webpackChunkName: "CounterPage" */ './containers/CounterPage')
);
const CounterPage = (props: Record<string, any>) => (
<React.Suspense fallback={<h1>Loading...</h1>}>
<LazyCounterPage {...props} />
</React.Suspense>
);
export default function Routes() {
return (
<App>
<Switch>
<Route path={routes.COUNTER} component={CounterPage} />
<Route path={routes.HOME} component={HomePage} />
</Switch>
</App>
);
}
app/app.global.css
+ 8
− 37
View file @ bf1f4af3
/* /* Global styles for the entire app
*
* @NOTE: Prepend a `~` to css file paths that are in your node_modules * @NOTE: Prepend a `~` to css file paths that are in your node_modules
* See https://github.com/webpack-contrib/sass-loader#imports * See https://github.com/webpack-contrib/sass-loader#imports
*/ */
@import '~@fortawesome/fontawesome-free/css/all.css';
body { body {
position: relative; color: rgba(255, 255, 255, 0.9);
color: white;
height: 100vh; height: 100vh;
background-color: #232c39; background-color: #404040;
background-image: linear-gradient(
45deg,
rgba(0, 216, 255, 0.5) 10%,
rgba(0, 1, 127, 0.7)
);
font-family: Arial, Helvetica, Helvetica Neue, serif;
overflow-y: hidden;
}
h2 {
margin: 0; margin: 0;
font-size: 2.25rem;
font-weight: bold;
letter-spacing: -0.025em;
color: #fff;
}
p {
font-size: 24px;
}
li {
list-style: none;
}
a {
color: white;
opacity: 0.75;
text-decoration: none;
} }
a:hover { .content {
opacity: 1; display: flex;
text-decoration: none; flex-flow: column nowrap;
cursor: pointer; justify-content: space-between;
} }
app/app.html
+ 11
− 1
View file @ bf1f4af3
<!--This is equivalent to the usual index.html we're familiar with-->
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<title>Hello Electron React!</title> <title>Hello Electron React!</title>
<link
href="https://fonts.googleapis.com/css2?family=Raleway:wght@200;300;400;500;600;700&display=swap"
rel="stylesheet"
/>
<link
href="https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@400;500;600&display=swap"
rel="stylesheet"
/>
<script> <script>
(() => { (() => {
if ( if (
...@@ -18,6 +27,7 @@ ...@@ -18,6 +27,7 @@
})(); })();
</script> </script>
</head> </head>
<body> <body>
<div id="root"></div> <div id="root"></div>
<script> <script>
...@@ -40,7 +50,7 @@ ...@@ -40,7 +50,7 @@
if (scripts.length) { if (scripts.length) {
document.write( document.write(
scripts scripts
.map(script => `<script defer src="${script}"><\/script>`) .map((script) => `<script defer src="${script}"><\/script>`)
.join('') .join('')
); );
} }
......
app/app.icns deleted 100644 → 0
NaN GiB (NaN%)
View file @ b9208eae
File suppressed by a .gitattributes entry or the file's encoding is unsupported.
app/components/Home.css deleted 100644 → 0
+ 0
− 14
View file @ b9208eae
.container {
position: absolute;
top: 30%;
left: 10px;
text-align: center;
}
.container h2 {
font-size: 5rem;
}
.container a {
font-size: 1.4rem;
}
app/components/Home.tsx deleted 100644 → 0
+ 0
− 14
View file @ b9208eae
import React from 'react';
import { Link } from 'react-router-dom';
import routes from '../constants/routes.json';
import styles from './Home.css';
import runSSH from '../utils/ssh';
export default function Home(): JSX.Element {
return (
<div className={styles.container} data-tid="container">
<h2>Home</h2>
<Link to={routes.COUNTER}>to Counter</Link>
</div>
);
}
app/components/Login.tsx 0 → 100644
+ 168
− 0
View file @ bf1f4af3
import React, { useState, useContext } from 'react';
import {
TextField,
Button,
Paper,
Typography,
makeStyles,
} from '@material-ui/core';
import { useHistory, useLocation } from 'react-router';
import clsx from 'clsx';
import { SqlManagerContext } from '../context/SqlManagerContext';
import SqlManager from '../../backend/recorder/SqlManager';
import { LoadingContext } from '../context/LoadingContext';
import routes from '../routes';
import { LoginDetailsContext } from '../context/LoginDetailsContext';
const useStyles = makeStyles((theme) => ({
wrapper: {
display: 'flex',
flexFlow: 'column nowrap',
flexShrink: 1,
// alignItems: 'center',
maxWidth: 300 + theme.spacing(4),
},
container: {
display: 'flex',
flexFlow: 'column nowrap',
flexGrow: 0,
flexShrink: 1,
width: 300,
padding: `${theme.spacing(1)}px ${theme.spacing(2)}px`,
},
content: {
display: 'flex',
flexFlow: 'column nowrap',
},
element: {
marginBottom: theme.spacing(1),
},
title: {
textAlign: 'center',
marginBottom: theme.spacing(2),
},
}));
interface LoginProps {
onConnect?: () => void;
}
const DefaultProps = {
onConnect: undefined,
};
export default function Login({ onConnect = undefined }: LoginProps) {
const sqlManagerContext = useContext(SqlManagerContext);
const loadingContext = useContext(LoadingContext);
const loginDetailsContext = useContext(LoginDetailsContext);
const history = useHistory();
const location = useLocation();
const [host, setHost] = useState(
loginDetailsContext?.loginDetails?.host || ''
);
const [user, setUser] = useState(
loginDetailsContext?.loginDetails?.user || ''
);
const [password, setPassword] = useState(
loginDetailsContext?.loginDetails?.password || ''
);
const [port, setPort] = useState(
Number(loginDetailsContext?.loginDetails?.port || 33060)
);
const [database, setDatabase] = useState(
loginDetailsContext?.loginDetails?.database || ''
);
async function handleConnectByLogin() {
let manager;
if (!sqlManagerContext?.sqlManager) {
manager = new SqlManager();
sqlManagerContext?.setSqlManager(manager);
} else {
manager = sqlManagerContext.sqlManager;
}
try {
loadingContext?.setConnected(false);
loadingContext?.setConnecting(true);
await manager.connect({ host, user, password, port }, database);
loadingContext?.setConnecting(false);
loadingContext?.setConnected(true);
if (location.pathname === routes.login) {
console.log('Routing to dashboard');
history.push(routes.dashboard);
} else if (onConnect) {
onConnect();
}
} catch (error) {
console.error(error);
loadingContext?.setConnecting(false);
loadingContext?.setConnected(false);
}
}
// TODO: Show connection indicator (spinning circle)
// TODO: Show result of connection (success/failure)
const classes = useStyles();
return (
<div className={classes.wrapper}>
<Paper className={classes.container} elevation={1}>
<Typography className={classes.title} variant="h5">
Connect to a database
</Typography>
<div className={clsx(classes.content, classes.element)}>
<TextField
className={classes.element}
variant="filled"
label="Host"
value={host}
onChange={(event) => setHost(event.target.value)}
/>
<TextField
className={classes.element}
variant="filled"
label="User"
value={user}
onChange={(event) => setUser(event.target.value)}
/>
<TextField
className={classes.element}
variant="filled"
label="Password"
type="password"
value={password}
onChange={(event) => setPassword(event.target.value)}
/>
<TextField
className={classes.element}
variant="filled"
label="Port"
value={port}
onChange={(event) => setPort(Number(event.target.value))}
/>
<TextField
className={classes.element}
variant="filled"
label="Database"
value={database}
onChange={(event) => setDatabase(event.target.value)}
/>
</div>
<Button
type="button"
variant="contained"
color="primary"
onClick={() => handleConnectByLogin()}
>
Connect
</Button>
</Paper>
</div>
);
}
Login.defaultProps = DefaultProps;
app/components/MemoryChart.tsx 0 → 100644
+ 142
− 0
View file @ bf1f4af3
import React, { useState, ReactElement, ReactNode } from 'react';
import {
Legend,
LineChart,
Line,
CartesianGrid,
XAxis,
YAxis,
Tooltip,
ResponsiveContainer,
Surface,
Symbols,
ContentRenderer,
LegendProps,
} from 'recharts';
import _ from 'lodash';
import { MemoryPerformance } from '../../backend/data-processor/DataProcessor';
interface Payload {
value: string;
id: number;
type: string;
color: string;
}
const chartDataMock: MemoryPerformance = [
{ relative_time: 0, geom: 0, total: 235378 },
{ relative_time: 1, geom: 0, total: 263058 },
{ relative_time: 2, geom: 0, total: 263058 },
{ relative_time: 3, geom: 265, total: 263371 },
{ relative_time: 4, geom: 265, total: 263371 },
{ relative_time: 5, geom: 387, total: 263493 },
{ relative_time: 6, geom: 3267, total: 266373 },
{ relative_time: 7, geom: 3267, total: 266373 },
{ relative_time: 8, geom: 32067, total: 295173 },
{ relative_time: 9, geom: 32067, total: 295173 },
{ relative_time: 10, geom: 256503, total: 519609 },
{ relative_time: 11, geom: 320067, total: 726837 },
{ relative_time: 12, geom: 320067, total: 726837 },
{ relative_time: 13, geom: 1349729, total: 1756499 },
{ relative_time: 14, geom: 1442129, total: 1848899 },
{ relative_time: 15, geom: 1785089, total: 2191859 },
{ relative_time: 16, geom: 1980689, total: 2387459 },
{ relative_time: 17, geom: 1164423, total: 1571193 },
{ relative_time: 18, geom: 1418583, total: 1825353 },
{ relative_time: 19, geom: 1589703, total: 1996473 },
{ relative_time: 20, geom: 0, total: 216938 },
];
export default function MemoryChart() {
const [disabled, setDisabled] = useState<Array<string>>([]);
const [chartData, setChartData] = useState<MemoryPerformance>(chartDataMock);
const [chartColors, setChartColors] = useState({
geom: '#8884d8',
total: '#82ca9d',
});
function handleClick(dataKey: string) {
if (_.includes(disabled, dataKey)) {
setDisabled(disabled.filter((obj) => obj !== dataKey));
} else {
setDisabled(disabled.concat(dataKey));
}
}
function renderCustomizedLegend(props: {
payload: Array<Payload>;
}): ReactNode {
const { payload } = props;
return (
<div className="customized-legend">
{payload.map((entry: { value: string; color: string }) => {
const { value, color } = entry;
const active = _.includes(disabled, value);
const style = {
marginRight: 10,
color: active ? '#AAA' : '#000',
};
return (
<span
role="presentation"
className="legend-item"
onClick={() => handleClick(value)}
style={style}
key={value}
>
{/* viewBox="0 0 10 10" */}
<Surface width={10} height={10}>
<Symbols cx={5} cy={5} type="circle" size={50} fill={color} />
{active && (
<Symbols cx={5} cy={5} type="circle" size={25} fill="#FFF" />
)}
</Surface>
<span>{value}</span>
</span>
);
})}
</div>
);
}
return (
<div className="highlight-bar-charts">
<ResponsiveContainer height={400}>
<LineChart
width={800}
height={500}
data={chartData}
margin={{ top: 20, right: 30, left: 20, bottom: 5 }}
>
<CartesianGrid strokeDasharray="3 10" />
<XAxis dataKey="relative_time" />
<YAxis />
<Tooltip />
<Legend
verticalAlign="bottom"
height={36}
align="left"
payload={_.toPairs(chartColors).map((pair, i) => ({
value: pair[0],
id: i,
type: 'line',
color: pair[1],
}))}
content={renderCustomizedLegend}
/>
{_.toPairs(chartColors)
.filter((pair) => !_.includes(disabled, pair[0]))
.map((pair) => (
<Line
type="monotone"
dataKey={pair[0]}
key={pair[0]}
stroke={pair[1]}
/>
))}
</LineChart>
</ResponsiveContainer>
</div>
);
}
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment