Merge pull request #1325 from Chia-Network/9-2024-bug-fixes-updates

fixes and improvements made in the course of core-registry ui refactors
Chia-Network · Oct 1, 2024 · cd1aaac · cd1aaac
2 parents 116e5d1 + d1bfe9d
commit cd1aaac
Show file tree

Hide file tree

Showing 28 changed files with 845 additions and 1,101 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -26,64 +26,65 @@
     "electron:package:linux": "npm run clean && npm run build && electron-builder -l -c.extraMetadata.main=build/main.js"
   },
   "dependencies": {
-    "@emotion/react": "^11.13.0",
+    "@emotion/react": "^11.13.3",
     "@emotion/styled": "^11.13.0",
     "@mui/material": "^5.16.7",
     "@reduxjs/toolkit": "^2.2.7",
     "@tailwindcss/aspect-ratio": "^0.4.2",
-    "@tailwindcss/forms": "^0.5.7",
+    "@tailwindcss/forms": "^0.5.9",
     "@types/styled-components": "^5.1.34",
     "@xterm/xterm": "^5.5.0",
     "components": "^0.1.0",
-    "dayjs": "^1.11.12",
+    "dayjs": "^1.11.13",
     "diff": "^5.2.0",
-    "express": "^4.19.2",
+    "express": "^4.21.0",
     "flowbite": "^2.5.1",
     "flowbite-react": "^0.7.8",
     "flowbite-typography": "^1.0.3",
     "formik": "^2.4.6",
     "lodash": "^4.17.21",
-    "qrcode.react": "^3.1.0",
+    "qrcode.react": "^3.2.0",
     "react": "^18.3.1",
     "react-content-loader": "^7.0.2",
     "react-dom": "^18.3.1",
     "react-intl": "^6.6.8",
     "react-redux": "^9.1.2",
-    "react-router-dom": "^6.26.1",
+    "react-router-dom": "^6.26.2",
     "react-webview": "^0.1.0",
     "redux-persist": "^6.0.0",
     "simplebar": "^6.2.7",
     "simplebar-react": "^3.2.6",
-    "styled-components": "^6.1.12",
+    "styled-components": "^6.1.13",
+    "tailwind-scrollbar": "^3.1.0",
     "uuid": "^9.0.1",
     "yup": "^1.4.0"
   },
   "devDependencies": {
-    "@commitlint/config-conventional": "^19.2.2",
-    "@types/react": "^18.3.3",
+    "@commitlint/config-conventional": "^19.5.0",
+    "@types/react": "^18.3.7",
     "@types/react-dom": "^18.3.0",
     "@types/react-router-dom": "^5.3.3",
     "@typescript-eslint/eslint-plugin": "^6.21.0",
     "@typescript-eslint/parser": "^6.21.0",
     "@vitejs/plugin-react-swc": "^3.7.0",
     "autoprefixer": "^10.4.20",
-    "commitlint": "^19.4.0",
+    "commitlint": "^19.5.0",
     "concurrently": "^8.2.2",
     "cross-env": "^7.0.3",
     "electron": "^28.3.3",
     "electron-builder": "^24.13.3",
-    "eslint": "^8.57.0",
+    "eslint": "^8.57.1",
     "eslint-plugin-react-hooks": "^4.6.2",
-    "eslint-plugin-react-refresh": "^0.4.9",
-    "husky": "^9.1.4",
-    "lint-staged": "^15.2.9",
-    "postcss": "^8.4.41",
+    "eslint-plugin-react-refresh": "^0.4.12",
+    "husky": "^9.1.6",
+    "lint-staged": "^15.2.10",
+    "postcss": "^8.4.47",
     "prettier": "^3.3.3",
     "prettier-eslint": "^16.3.0",
     "standard-version": "^9.5.0",
-    "tailwindcss": "^3.4.10",
-    "typescript": "^5.5.4",
-    "vite": "^5.4.1",
+    "tailwindcss": "^3.4.12",
+    "typescript": "^5.6.2",
+    "vite": "^5.4.6",
     "wait-on": "^7.2.0"
   },
   "standard-version": {

diff --git a/src/renderer/App.tsx b/src/renderer/App.tsx
@@ -53,6 +53,7 @@ function App() {
   }, [appStore.apiHost, appStore.configFileLoaded, fetchedConfig, configFileLoading, dispatch]);
 
   useEffect(() => {
+    // give the setConfigFileLoaded action time to dispatch
     if (!configFileLoading) setTimeout(() => setAppLoading(false), 400);
   }, [configFileLoading]);
 

diff --git a/src/renderer/components/blocks/buttons/ConnectButton.tsx b/src/renderer/components/blocks/buttons/ConnectButton.tsx
@@ -35,6 +35,12 @@ const ConnectButton: React.FC = () => {
     setTimeout(() => window.location.reload(), 0);
   };
 
+  const onClose = () => {
+    refetch();
+    setTimeout(() => setActive(false));
+    setTimeout(() => window.location.reload(), 0);
+  };
+
   return (
     <>
       <Button
@@ -45,7 +51,7 @@ const ConnectButton: React.FC = () => {
       >
         {!serverHealth?.isHealthy ? <FormattedMessage id="connect" /> : <FormattedMessage id="disconnect" />}
       </Button>
-      {isActive && <ConnectModal onClose={() => setActive(false)} />}
+      {isActive && <ConnectModal onClose={onClose} />}
     </>
   );
 };

diff --git a/src/renderer/components/blocks/buttons/FormButton.tsx b/src/renderer/components/blocks/buttons/FormButton.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { Button, Spinner } from '@/components';
+import { Button } from '@/components';
 
 interface FormButtonProps {
   isSubmitting: boolean;
@@ -9,8 +9,12 @@ interface FormButtonProps {
 
 const FormButton: React.FC<FormButtonProps> = ({ isSubmitting, formikErrors, children }) => {
   return (
-    <Button type="submit" disabled={isSubmitting || Boolean(Object.keys(formikErrors).length)}>
-      {isSubmitting ? <Spinner size="sm" light={true} /> : children}
+    <Button
+      type="submit"
+      disabled={isSubmitting || Boolean(Object.keys(formikErrors).length)}
+      isProcessing={isSubmitting}
+    >
+      {children}
     </Button>
   );
 };

diff --git a/src/renderer/components/blocks/forms/CreateOrganizationForm.tsx b/src/renderer/components/blocks/forms/CreateOrganizationForm.tsx
@@ -1,8 +1,8 @@
 import React, { useCallback } from 'react';
 import { ErrorMessage, Field, Form, Formik } from 'formik';
 import * as yup from 'yup';
-import { Button, FloatingLabel, Spinner } from '@/components';
-import { IntlShape, useIntl } from 'react-intl';
+import { FloatingLabel, FormButton } from '@/components';
+import { FormattedMessage, IntlShape, useIntl } from 'react-intl';
 
 const validationSchema = yup.object({
   name: yup.string().required('Name is required'),
@@ -42,9 +42,9 @@ const CreateOrganizationForm: React.FC<FormProps> = ({ onSubmit }) => {
             </Field>
             {touched.name && <ErrorMessage name="name" component="div" className="text-red-600" />}
           </div>
-          <Button type="submit" disabled={isSubmitting}>
-            {isSubmitting ? <Spinner size="sm" light={true} /> : 'Submit'}
-          </Button>
+          <FormButton isSubmitting={isSubmitting} formikErrors={errors}>
+            <FormattedMessage id="submit" />
+          </FormButton>
         </Form>
       )}
     </Formik>

diff --git a/src/renderer/components/blocks/forms/ImportOrganizationForm.tsx b/src/renderer/components/blocks/forms/ImportOrganizationForm.tsx
@@ -1,8 +1,8 @@
 import React, { useCallback } from 'react';
 import { ErrorMessage, Field, Form, Formik } from 'formik';
 import * as yup from 'yup';
-import { Button, FloatingLabel, Spinner } from '@/components';
-import { IntlShape, useIntl } from 'react-intl';
+import { FloatingLabel, FormButton } from '@/components';
+import { FormattedMessage, IntlShape, useIntl } from 'react-intl';
 
 const validationSchema = yup.object({
   orgUid: yup.string().length(64).required('OrgUid is required'),
@@ -43,9 +43,9 @@ const ImportOrganizationForm: React.FC<FormProps> = ({ onSubmit }) => {
               </Field>
               {touched.orgUid && <ErrorMessage name="orgUid" component="div" className="text-red-600" />}
             </div>
-            <Button type="submit" disabled={isSubmitting}>
-              {isSubmitting ? <Spinner size="sm" light={true} /> : 'Submit'}
-            </Button>
+            <FormButton isSubmitting={isSubmitting} formikErrors={errors}>
+              <FormattedMessage id="submit" />
+            </FormButton>
           </Form>
         )}
       </Formik>