ui: drop blueprintjs 6 (#1073)

packages/ui-default/pages/problem_config.page.styl

@@ -1,50 +1,14 @@
 .page--problem_config
+  .main
+    .row
+      max-width: 100vw !important;
+
   .textbox,.select
     margin: 0
-  
-  .bp6-tab-panel
-    margin-top: 5px
-
-  .bp6-dialog
-    font-family: var(--code-font-family)
-    background: #fff
-
-    .autocomplete-container
-      font-size: 0.875rem
-      color: #666
-
-    .bp6-dialog-footer-fixed
-      border-top: 0
-
-      .button
-        margin: 0
 
   input::placeholder
     color: rgba(95,107,124,.6)!important
 
-  .bp6-input-group
-    input
-      appearance: none
-      display: block
-      width: 100%
-      font-size: 0.875rem
-      height: 2.1875rem
-      line-height: 1.2
-      padding: 0.3125rem;
-      border: 1px solid #ddd
-      color: inherit
-      border-radius: 0
-      outline: 2px solid transparent
-      transition: outline-color 0.2s, border-color 0.2s
-      transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1)
-      box-shadow: none
-
-  .bp6-tag.bp6-minimal
-    background: transparent
-  
-  .bp6-input-action
-      pointer-events: none
-
   .problem-config-form
     font-family: var(--code-font-family)
   
@@ -55,4 +19,3 @@
 
   .hover-row.status-bar
     display: none
-  

packages/ui-default/pages/problem_config.page.tsx

@@ -1,4 +1,5 @@
 import { normalizeSubtasks, readSubtasksFromFiles, SubtaskType } from '@hydrooj/common';
+import { MantineProvider } from '@mantine/core';
 import $ from 'jquery';
 import yaml from 'js-yaml';
 import React from 'react';
@@ -114,6 +115,7 @@ const page = new NamedPage('problem_config', () => {
       type: 'CONFIG_LOAD',
       payload: request.get(''),
     });
+    let autoConfigTriggered = false;
     const unsubscribe = store.subscribe(() => {
       // TODO set yaml schema
       const state = store.getState();
@@ -129,7 +131,10 @@ const page = new NamedPage('problem_config', () => {
         delete state.config.cases;
         delete state.config.score;
       }
-      if (state.config.subtasks?.length) return;
+      if (state.config.subtasks?.length || autoConfigTriggered) {
+        autoConfigTriggered = true;
+        return;
+      }
       const testdata = (state.testdata || []).map((i) => i.name);
       unsubscribe();
       const subtasks = readSubtasksFromFiles(testdata, state.config);
@@ -138,11 +143,11 @@ const page = new NamedPage('problem_config', () => {
         subtasks: normalizeSubtasks(subtasks, (i) => i, state.config.time, state.config.memory, true),
       });
     });
-    createRoot(document.getElementById('ProblemConfig')!).render(
+    createRoot(document.getElementById('ProblemConfig')!).render(<MantineProvider>
       <Provider store={store}>
         <ProblemConfig onSave={() => uploadConfig(store.getState().config)} />
-      </Provider>,
-    );
+      </Provider>
+    </MantineProvider>);
   }
 
   mountComponent();

packages/ui-default/pages/problem_main.page.tsx

@@ -373,7 +373,7 @@ function ProblemSelectionDisplay(props) { // eslint-disable-line
   }, [pids]);
 
   return (<>
-    <a href="javascript:;" className="menu__link display-mode-hide" onClick={() => setDialogOpen(true)}>
+    <a className="menu__link display-mode-hide" onClick={() => setDialogOpen(true)}>
       <span className="icon icon-stack"></span>
       {' '}{i18n('{0} problem(s) selected', pids.length)}
     </a>