Merge pull request #24 from 12f23eddde/fix-frontend-freeze

Fix frontend freezing & add banner

frontend/netlify.toml

@@ -0,0 +1,26 @@
+[build.environment]
+  # bypass npm auto install
+  NPM_FLAGS = "--version"
+  NODE_VERSION = "16"
+
+[build]
+  publish = "build"
+# command = "npx pnpm i --store=node_modules/.pnpm-store && npx pnpm run build"
+
+[[redirects]]
+  from = "/api/*"
+  to = "http://gfibot.io:5000/api/:splat"
+  status = 200
+  force = true
+  [redirects.headers]
+    X-From = "Netlify"
+
+[[redirects]]
+  from = "/*"
+  to = "/index.html"
+  status = 200
+
+[[headers]]
+  for = "/manifest.webmanifest"
+  [headers.values]
+    Content-Type = "application/manifest+json"

frontend/package.json

@@ -108,7 +108,8 @@
     "build:prod": "cross-env REACT_APP_ENV=production node scripts/build.js",
     "build:dev": "cross-env REACT_APP_ENV=development node scripts/build.js",
     "test": "node scripts/test.js",
-    "prepare": "cd .. && husky install"
+    "prepare": "cd .. && husky install",
+    "dev": "REACT_APP_BASE_URL='https://gfibot.io/' npm run start"
   },
   "eslintConfig": {
     "extends": [

frontend/scripts/build.js

@@ -170,26 +170,26 @@ function build(previousFileSizes) {
         }
         return reject(new Error(messages.errors.join('\n\n')));
       }
-      if (
-        process.env.CI &&
-        (typeof process.env.CI !== 'string' ||
-          process.env.CI.toLowerCase() !== 'false') &&
-        messages.warnings.length
-      ) {
-        // Ignore sourcemap warnings in CI builds. See #8227 for more info.
-        const filteredWarnings = messages.warnings.filter(
-          (w) => !/Failed to parse source map/.test(w)
-        );
-        if (filteredWarnings.length) {
-          console.log(
-            chalk.yellow(
-              '\nTreating warnings as errors because process.env.CI = true.\n' +
-                'Most CI servers set it automatically.\n'
-            )
-          );
-          return reject(new Error(filteredWarnings.join('\n\n')));
-        }
-      }
+      // if (
+      //   process.env.CI &&
+      //   (typeof process.env.CI !== 'string' ||
+      //     process.env.CI.toLowerCase() !== 'false') &&
+      //   messages.warnings.length
+      // ) {
+      //   // Ignore sourcemap warnings in CI builds. See #8227 for more info.
+      //   const filteredWarnings = messages.warnings.filter(
+      //     (w) => !/Failed to parse source map/.test(w)
+      //   );
+      //   if (filteredWarnings.length) {
+      //     console.log(
+      //       chalk.yellow(
+      //         '\nTreating warnings as errors because process.env.CI = true.\n' +
+      //           'Most CI servers set it automatically.\n'
+      //       )
+      //     );
+      //     return reject(new Error(filteredWarnings.join('\n\n')));
+      //   }
+      // }
 
       const resolveArgs = {
         stats,

frontend/src/pages/main/GFIBanners.tsx

@@ -0,0 +1,12 @@
+import React, { forwardRef, useEffect, useState } from 'react';
+import { useLocation } from 'react-router-dom';
+
+export const GFIAlphaWarning = () => (
+<div className="kanban wrapper">
+    <div className="gfi-wrapper tags" style={{ backgroundColor: "rgba(255, 91, 91, 0.2)"}}>
+        <div style={{ marginBottom: '0.3rem' }}>Warning</div>
+        <div className="tags wrapper" style={{ marginBottom: '0.1rem' }}>
+            GFI-Bot is undergoing rapid development and still highly unstable. It is not recommended to use it in production.
+        </div>
+    </div>
+</div>)

frontend/src/pages/main/GFIRepoDisplayView.tsx

@@ -481,11 +481,11 @@ function IssueOverlayItem(props: IssueOverlayItem) {
         },
         {
           title: 'AUC',
-          data: parseFloat(trainingSummary.auc.toFixed(2)),
+          data: trainingSummary.auc? parseFloat(trainingSummary.auc.toFixed(2)) : 0,
         },
         {
           title: 'ACC',
-          data: parseFloat(trainingSummary.accuracy.toFixed(2)),
+          data: trainingSummary.auc? parseFloat(trainingSummary.auc.toFixed(2)) : 0,
         },
       ]
     : [];
@@ -575,11 +575,11 @@ export const GFIRepoStaticsDemonstrator = forwardRef(
           },
           {
             title: 'AUC',
-            data: parseFloat(trainingSummary.auc.toFixed(2)),
+            data: trainingSummary.auc? parseFloat(trainingSummary.auc.toFixed(2)) : 0,
           },
           {
             title: 'ACC',
-            data: parseFloat(trainingSummary.accuracy.toFixed(2)),
+            data: trainingSummary.auc? parseFloat(trainingSummary.accuracy.toFixed(2)) : 0,
           },
         ]
       : [];

frontend/src/pages/main/mainPage.tsx

@@ -41,6 +41,7 @@ import {
 import { GFIRepoInfo, GFITrainingSummary } from '../../module/data/dataModel';
 import { GFIRootReducers } from '../../module/storage/configureStorage';
 import { GFITrainingSummaryDisplayView } from './GFITrainingSummaryDisplayView';
+import { GFIAlphaWarning } from './GFIBanners';
 
 export function MainPage() {
   const dispatch = useDispatch();
@@ -55,6 +56,7 @@ export function MainPage() {
 
   const [showLoginMsg, setShowLoginMsg] = useState(false);
   const [showSearchMsg, setShowSearchMsg] = useState(false);
+  const [showBannerMsg, setShowBannerMsg] = useState(true);
 
   const isMobile = useIsMobile();
   const { width, height } = useWindowSize();
@@ -504,6 +506,7 @@ const GFIDadaKanban = forwardRef((props: GFIDadaKanban, ref) => {
         fontFamily: defaultFontFamily,
       }}
     >
+      <GFIAlphaWarning />
       <div className="kanban wrapper">
         <div className="gfi-wrapper tags">
           <div style={{ marginBottom: '0.3rem' }}>Languages</div>