Reinstate schema import, remove unneccesary components. Fixes: Hyperfoil#1676

Author: johnaohara

horreum-web/src/components/ExportImport.tsx

@@ -36,7 +36,7 @@ export default function ImportButton({label, onLoad, onImport, onImported}: Impo
     }
     return (
         <>
-            <Button variant="secondary" onClick={() => setOpen(true)}>
+            <Button style={{marginRight: "16px", width: "100pt"}} variant="secondary" onClick={() => setOpen(true)}>
                 {label || "Import"}
             </Button>
             <Modal

horreum-web/src/components/ImportButton.tsx

@@ -24,6 +24,7 @@ export function modifiedFunc(ref: TabFunctionsRef) {
 }
 
 type SavedTabProps = FragmentTabProps & {
+    canSave: boolean
     onSave(): Promise<any>
     onReset?(): void
     isModified(): boolean
@@ -63,7 +64,7 @@ export default function SavedTabs(props: SavedTabsProps) {
                 onSave={() => {
                     const childProps = children[activeKey.current].props
                     if ("onSave" in childProps) {
-                        return childProps.onSave().then(_ => {
+                        return childProps.onSave?.().then(_ => {
                             blocker.proceed?.()
                             if (props.afterSave) {
                                 return props.afterSave()
@@ -91,7 +92,7 @@ export default function SavedTabs(props: SavedTabsProps) {
                     <FragmentTab key={i} {...c.props} />
                 ))}
             </FragmentTabs>
-            {props.canSave !== false && "onSave" in children[activeKey.current].props && (
+            {props.canSave !== false && "canSave" in children[activeKey.current].props && (children[activeKey.current].props as SavedTabProps).canSave && (
                 <ActionGroup style={{ marginTop: 0 }}>
                     <Button
                         variant="primary"
@@ -101,7 +102,7 @@ export default function SavedTabs(props: SavedTabsProps) {
                             const childProps = children[activeKey.current].props
                             if ("onSave" in childProps) {
                                 childProps
-                                    .onSave()
+                                    .onSave?.()
                                     .then(() => {
                                         if (props.afterSave) {
                                             return props.afterSave()

horreum-web/src/components/SavedTabs.tsx

@@ -29,6 +29,7 @@ export default function Admin() {
                                 title="Administrators"
                                 fragment="administrators"
                                 onSave={saveFunc(adminFuncsRef)}
+                                canSave={true}
                                 onReset={resetFunc(adminFuncsRef)}
                                 isModified={modifiedFunc(adminFuncsRef)}
                             >
@@ -38,6 +39,7 @@ export default function Admin() {
                                 title="Teams"
                                 fragment="teams"
                                 onSave={saveFunc(teamsFuncsRef)}
+                                canSave={true}
                                 onReset={resetFunc(teamsFuncsRef)}
                                 isModified={modifiedFunc(teamsFuncsRef)}
                             >

horreum-web/src/domain/admin/Admin.tsx

@@ -38,10 +38,10 @@ import TeamSelect from "../../components/TeamSelect"
 import Transformers from "./Transformers"
 import Labels from "./Labels"
 import {Access, getSchema, Schema as SchemaDef, schemaApi, Banner as BannerData} from "../../api"
-import SchemaExportImport from "./SchemaExportImport"
 import {AppContext} from "../../context/appContext";
 import {AppContextType} from "../../context/@types/appContextTypes";
 import { TimeoutBanner, TimeoutBannerProps } from "../../Banner"
+import ExportButton from "../../components/ExportButton";
 
 type SchemaParams = {
     schemaId: string
@@ -314,6 +314,7 @@ export default function Schema() {
                                 title="General"
                                 fragment="general"
                                 onSave={save}
+                                canSave={true}
                                 onReset={() => {
                                     setModifiedSchema(schema)
                                 }}
@@ -332,6 +333,7 @@ export default function Schema() {
                                 title="JSON schema"
                                 fragment="json-schema"
                                 onSave={save}
+                                canSave={true}
                                 onReset={() => {
                                     setModifiedSchema(schema)
                                     setEditorSchema(schema?.schema ? toString(schema?.schema) : undefined)
@@ -384,6 +386,7 @@ export default function Schema() {
                                 title="Transformers"
                                 fragment="transformers"
                                 onSave={saveFunc(transformersFuncsRef)}
+                                canSave={true}
                                 onReset={resetFunc(transformersFuncsRef)}
                                 isModified={modifiedFunc(transformersFuncsRef)}
                             >
@@ -397,6 +400,7 @@ export default function Schema() {
                                 title="Labels"
                                 fragment="labels"
                                 onSave={saveFunc(labelsFuncsRef)}
+                                canSave={true}
                                 onReset={resetFunc(labelsFuncsRef)}
                                 isModified={modifiedFunc(labelsFuncsRef)}
                             >
@@ -405,12 +409,18 @@ export default function Schema() {
                             <SavedTab
                                 title="Export"
                                 fragment="export"
-                                onSave={() => Promise.resolve()}
                                 onReset={noop}
+                                canSave={false}
+                                onSave={() => Promise.resolve()}
                                 isHidden={!isTester}
                                 isModified={() => false}
                             >
-                                <SchemaExportImport id={schemaIdVal} name={schema?.name || "schema"} />
+
+                                <Form isHorizontal>
+                                    <FormGroup label="Export" fieldId="export">
+                                        <ExportButton name={schema?.name || "schema"} export={() => schemaApi.exportSchema(schemaIdVal)} />
+                                    </FormGroup>
+                                </Form>
                             </SavedTab>
                         </SavedTabs>
                     </CardBody>