Merge pull request #5 from fosslife/dev

Dev

.eslintignore

@@ -0,0 +1,8 @@
+node_modules
+.DS_Store
+dist
+dist-ssr
+*.local
+node_modules/
+target/
+**/*.d.ts

.eslintrc.js

@@ -0,0 +1,53 @@
+module.exports = {
+  root: true,
+  parser: "@typescript-eslint/parser",
+  parserOptions: {
+    ecmaVersion: 2020,
+    sourceType: "module",
+    ecmaFeatures: {
+      jsx: true,
+    },
+  },
+  settings: {
+    react: {
+      version: "detect",
+    },
+    "import/resolver": {
+      node: {
+        paths: ["src"],
+        extensions: [".js", ".jsx", ".ts", ".tsx"],
+      },
+    },
+  },
+  env: {
+    browser: true,
+    amd: true,
+    node: true,
+  },
+  extends: [
+    "eslint:recommended",
+    "plugin:react/recommended",
+    "plugin:jsx-a11y/recommended",
+    "plugin:prettier/recommended", // Make sure this is always the last element in the array.
+  ],
+  plugins: ["simple-import-sort", "prettier", "@typescript-eslint"],
+  rules: {
+    "prettier/prettier": ["error", {}, { usePrettierrc: true }],
+    "react/react-in-jsx-scope": "off",
+    "jsx-a11y/accessible-emoji": "off",
+    "react/prop-types": "off",
+    "no-unused-vars": "off",
+    "@typescript-eslint/no-unused-vars": ["warn"],
+    "@typescript-eslint/explicit-function-return-type": "off",
+    "simple-import-sort/imports": "error",
+    "simple-import-sort/exports": "error",
+    "jsx-a11y/anchor-is-valid": [
+      "error",
+      {
+        components: ["Link"],
+        specialLink: ["hrefLeft", "hrefRight"],
+        aspects: ["invalidHref", "preferButton"],
+      },
+    ],
+  },
+};

.github/workflows/release.yml

@@ -33,8 +33,8 @@ jobs:
         env:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
         with:
-          tagName: app-v__VERSION__ # the action automatically replaces \_\_VERSION\_\_ with the app version
-          releaseName: "App v__VERSION__"
+          tagName: DevToolsv__VERSION__ # the action automatically replaces \_\_VERSION\_\_ with the app version
+          releaseName: "DevTools-x v__VERSION__"
           releaseBody: "See the assets to download this version and install."
           releaseDraft: true
           prerelease: false

.gitignore

@@ -3,3 +3,6 @@ node_modules
 dist
 dist-ssr
 *.local
+
+# rollup analysis stats. not sure if this should be pushed to gh. maybe host it?
+stats.html

.prettierignore

@@ -0,0 +1,7 @@
+node_modules
+.DS_Store
+dist
+dist-ssr
+*.local
+node_modules/*
+target/

.prettierrc.js

@@ -0,0 +1,8 @@
+module.exports = {
+  semi: true,
+  trailingComma: "es5",
+  singleQuote: false,
+  printWidth: 80,
+  tabWidth: 2,
+  endOfLine: "lf",
+};

.vscode/settings.json

@@ -0,0 +1,3 @@
+{
+  "editor.formatOnSave": true
+}

package.json

@@ -6,13 +6,18 @@
     "dev": "vite",
     "build": "tsc && vite build",
     "preview": "vite preview",
-    "tauri": "tauri"
+    "tauri": "tauri",
+    "lint:fix": "eslint ./src --ext .jsx,.js,.ts,.tsx --fix",
+    "lint:format": "prettier  --loglevel warn --write \"./**/*.{js,jsx,ts,tsx,css,md,json}\" ",
+    "lint": "yarn lint:format && yarn lint:fix ",
+    "type-check": "tsc"
   },
   "dependencies": {
     "@chakra-ui/icons": "^1.1.1",
     "@chakra-ui/react": "^1.7.4",
     "@emotion/react": "^11",
     "@emotion/styled": "^11",
+    "@loadable/component": "^5.15.2",
     "@monaco-editor/react": "^4.3.1",
     "@react-hookz/web": "^12.3.0",
     "@tauri-apps/api": "^1.0.0-beta.8",
@@ -28,10 +33,22 @@
   "devDependencies": {
     "@tauri-apps/cli": "^1.0.0-beta.10",
     "@types/crypto-js": "^4.1.0",
+    "@types/loadable__component": "^5.13.4",
     "@types/react": "^17.0.33",
     "@types/react-dom": "^17.0.10",
+    "@typescript-eslint/eslint-plugin": "^5.10.2",
+    "@typescript-eslint/parser": "^5.10.2",
     "@vitejs/plugin-react": "^1.0.7",
+    "eslint": "^8.8.0",
+    "eslint-config-prettier": "^8.3.0",
+    "eslint-plugin-import": "^2.25.4",
+    "eslint-plugin-jsx-a11y": "^6.5.1",
+    "eslint-plugin-prettier": "^4.0.0",
+    "eslint-plugin-react": "^7.28.0",
+    "eslint-plugin-simple-import-sort": "^7.0.0",
     "monaco-editor": "^0.31.1",
+    "prettier": "^2.5.1",
+    "rollup-plugin-visualizer": "^5.5.4",
     "typescript": "^4.4.4",
     "vite": "^2.7.2"
   }

src-tauri/Cargo.toml

@@ -1,24 +1,29 @@
 [package]
 name = "app"
-version = "0.1.2"
+version = "0.1.3"
 description = "Developer tools desktop application"
-authors = ["Sparkenstein"]
+authors = [ "Sparkenstein" ]
 license = "MIT"
 repository = "https://github.com/fosslife/devtools-x"
 default-run = "app"
 edition = "2018"
 build = "src/build.rs"
 
-# See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html
-
 [build-dependencies]
 tauri-build = { version = "1.0.0-beta.4" }
 
 [dependencies]
 serde_json = "1.0"
-serde = { version = "1.0", features = ["derive"] }
+serde = { version = "1.0", features = [ "derive" ] }
 tauri = { version = "1.0.0-beta.8", features = ["api-all"] }
 
 [features]
 default = [ "custom-protocol" ]
 custom-protocol = [ "tauri/custom-protocol" ]
+
+[profile.release]
+panic = "abort"
+codegen-units = 1
+lto = true
+incremental = false
+opt-level = "s"  # can experiment with 'z' as well

src-tauri/tauri.conf.json

@@ -1,7 +1,7 @@
 {
   "package": {
     "productName": "dev-tools",
-    "version": "0.1.2"
+    "version": "0.1.3"
   },
   "build": {
     "distDir": "../dist",

src/App.tsx

@@ -1,13 +1,17 @@
 import { Flex } from "@chakra-ui/react";
+import loadable from "@loadable/component";
 import { useEffect } from "react";
 import { Route, Routes } from "react-router-dom";
-import { Welcome } from "./Components/Welcome";
-import { Hash } from "./Features/hash/Hash";
-import { JsonFormatter } from "./Features/Json/JsonFormatter";
-import { Random } from "./Features/random/Random";
+
 import { Navbar } from "./Layout/Navbar";
 import { db } from "./utils";
 
+// Lazy load components
+const Welcome = loadable(() => import("./Components/Welcome"));
+const Hash = loadable(() => import("./Features/hash/Hash"));
+const JsonFormatter = loadable(() => import("./Features/Json/JsonFormatter"));
+const Random = loadable(() => import("./Features/random/Random"));
+
 function App() {
   useEffect(() => {
     // TODO: Setup logging, caching

src/Components/Card.tsx

@@ -1,4 +1,4 @@
-import { Box, ChakraComponent, useStyleConfig } from "@chakra-ui/react";
+import { Box, useStyleConfig } from "@chakra-ui/react";
 import { Link } from "react-router-dom";
 
 // FIXME: idk what type will be

src/Components/Welcome.tsx

@@ -1,6 +1,6 @@
-import { Box, Flex, Heading, Text } from "@chakra-ui/react";
+import { Flex, Heading, Text } from "@chakra-ui/react";
 
-export const Welcome = () => {
+const Welcome = () => {
   return (
     <Flex
       h="full"
@@ -16,3 +16,5 @@ export const Welcome = () => {
     </Flex>
   );
 };
+
+export default Welcome;

src/Features/Json/JsonFormatter.tsx

@@ -1,14 +1,13 @@
-import { Tooltip, Button, Flex, Checkbox } from "@chakra-ui/react";
+import { Button, Checkbox, Flex, Tooltip } from "@chakra-ui/react";
 import Editor, {
-  DiffEditor,
-  type OnMount,
   type DiffOnMount,
-  type OnChange,
+  type OnMount,
+  DiffEditor,
 } from "@monaco-editor/react";
-import { fs } from "@tauri-apps/api";
-import { useEffect, useRef, useState } from "react";
-import { db } from "../../utils";
 import { useDebouncedCallback } from "@react-hookz/web/esm";
+import { useRef, useState } from "react";
+
+import { db } from "../../utils";
 
 // default
 const def = {
@@ -24,7 +23,7 @@ const def = {
   string: "Hello World",
 };
 
-export const JsonFormatter = () => {
+const JsonFormatter = () => {
   const editorRef = useRef<any>(null);
   const [diff, setDiff] = useState(false);
 
@@ -68,7 +67,7 @@ export const JsonFormatter = () => {
     editorRef.current = editor;
   };
 
-  const diffOnMout: DiffOnMount = (editor, monaco) => {
+  const diffOnMout: DiffOnMount = (editor) => {
     editorRef.current = editor;
   };
 
@@ -162,3 +161,5 @@ export const JsonFormatter = () => {
 Save editors in storage on change - p1
 fix formatting - instead of default values get editor text - p1
 */
+
+export default JsonFormatter;