Refactor types around export records

client/src/api/histories.export.ts

@@ -1,7 +1,10 @@
 import type { components } from "@/api/schema";
 import { fetcher } from "@/api/schema";
-import type { ObjectExportTaskResponse } from "@/components/Common/models/exportRecordModel";
-import { ExportRecordModel } from "@/components/Common/models/exportRecordModel";
+import {
+    type ExportRecord,
+    ExportRecordModel,
+    type ObjectExportTaskResponse,
+} from "@/components/Common/models/exportRecordModel";
 import { DEFAULT_EXPORT_PARAMS } from "@/composables/shortTermStorage";
 
 type ModelStoreFormat = components["schemas"]["ModelStoreFormat"];
@@ -69,7 +72,7 @@ export async function exportHistoryToFileSource(
  * @param record The export record to be imported
  * @returns A promise with the request response
  */
-export async function reimportHistoryFromRecord(record: ExportRecordModel) {
+export async function reimportHistoryFromRecord(record: ExportRecord) {
     return _importFromStoreAsync({
         store_content_uri: record.importUri,
         model_store_format: record.modelStoreFormat,

client/src/components/Common/ExportRecordDetails.vue

@@ -11,17 +11,18 @@ import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
 import { BAlert, BButton, BCard, BCardTitle } from "bootstrap-vue";
 import { computed } from "vue";
 
-import { ExportRecordModel } from "./models/exportRecordModel";
+import type { ColorVariant } from ".";
+import { ExportRecord } from "./models/exportRecordModel";
 
 import LoadingSpan from "@/components/LoadingSpan.vue";
 
 library.add(faCheckCircle, faClock, faExclamationCircle, faExclamationTriangle, faLink);
 
 interface Props {
-    record: ExportRecordModel;
+    record: ExportRecord;
     objectType: string;
     actionMessage?: string;
-    actionMessageVariant?: string;
+    actionMessageVariant?: ColorVariant;
 }
 
 const props = withDefaults(defineProps<Props>(), {
@@ -31,9 +32,9 @@ const props = withDefaults(defineProps<Props>(), {
 
 const emit = defineEmits<{
     (e: "onActionMessageDismissed"): void;
-    (e: "onReimport", record: ExportRecordModel): void;
-    (e: "onDownload", record: ExportRecordModel): void;
-    (e: "onCopyDownloadLink", record: ExportRecordModel): void;
+    (e: "onReimport", record: ExportRecord): void;
+    (e: "onDownload", record: ExportRecord): void;
+    (e: "onCopyDownloadLink", record: ExportRecord): void;
 }>();
 
 const title = computed(() => (props.record.isReady ? `Exported` : `Export started`));
@@ -112,7 +113,7 @@ function onMessageDismissed() {
                 <p class="mt-3">You can do the following actions with this {{ props.objectType }} export:</p>
 
                 <BAlert
-                    v-if="props.actionMessage !== null"
+                    v-if="props.actionMessage !== undefined"
                     :variant="props.actionMessageVariant"
                     show
                     fade

client/src/components/Common/ExportRecordTable.vue

@@ -12,19 +12,19 @@ import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
 import { BButton, BButtonGroup, BButtonToolbar, BCard, BCollapse, BLink, BTable } from "bootstrap-vue";
 import { computed, ref } from "vue";
 
-import { type ExportRecordModel } from "./models/exportRecordModel";
+import { type ExportRecord } from "./models/exportRecordModel";
 
 library.add(faCheckCircle, faDownload, faExclamationCircle, faFileImport, faLink, faSpinner);
 
 interface Props {
-    records: ExportRecordModel[];
+    records: ExportRecord[];
 }
 const props = defineProps<Props>();
 
 const emit = defineEmits<{
-    (e: "onReimport", record: ExportRecordModel): void;
-    (e: "onDownload", record: ExportRecordModel): void;
-    (e: "onCopyDownloadLink", record: ExportRecordModel): void;
+    (e: "onReimport", record: ExportRecord): void;
+    (e: "onDownload", record: ExportRecord): void;
+    (e: "onCopyDownloadLink", record: ExportRecord): void;
 }>();
 
 const fields = [
@@ -40,15 +40,15 @@ const isExpanded = ref(false);
 
 const title = computed(() => (isExpanded.value ? `Hide old export records` : `Show old export records`));
 
-async function reimportObject(record: ExportRecordModel) {
+async function reimportObject(record: ExportRecord) {
     emit("onReimport", record);
 }
 
-function downloadObject(record: ExportRecordModel) {
+function downloadObject(record: ExportRecord) {
     emit("onDownload", record);
 }
 
-function copyDownloadLink(record: ExportRecordModel) {
+function copyDownloadLink(record: ExportRecord) {
     emit("onCopyDownloadLink", record);
 }
 </script>

client/src/components/Common/index.ts

@@ -0,0 +1,2 @@
+// TODO: Not sure if this is the best place for this type
+export type ColorVariant = "primary" | "secondary" | "success" | "danger" | "warning" | "info" | "light" | "dark";

client/src/components/Common/models/exportRecordModel.ts

@@ -29,7 +29,7 @@ export interface ExportRecord {
     readonly stsDownloadId?: string;
     readonly isStsDownload: boolean;
     readonly canDownload: boolean;
-    readonly modelStoreFormat: string;
+    readonly modelStoreFormat: ModelStoreFormat;
     readonly exportParams?: ExportParams;
     readonly duration?: number | null;
     readonly canExpire: boolean;
@@ -62,17 +62,24 @@ export class ExportParamsModel implements ExportParams {
         return Boolean(this._params?.include_hidden);
     }
 
-    public equals(otherExportParams?: ExportParamsModel) {
+    public equals(otherExportParams?: ExportParams) {
         if (!otherExportParams) {
             return false;
         }
-        return (
-            this.modelStoreFormat === otherExportParams.modelStoreFormat &&
-            this.includeFiles === otherExportParams.includeFiles &&
-            this.includeDeleted === otherExportParams.includeDeleted &&
-            this.includeHidden === otherExportParams.includeHidden
-        );
+        return sameExportParams(this, otherExportParams);
+    }
+}
+
+export function sameExportParams(params1?: ExportParams, params2?: ExportParams): boolean {
+    if (!params1 || !params2) {
+        return false;
     }
+    return (
+        params1.modelStoreFormat === params2.modelStoreFormat &&
+        params1.includeFiles === params2.includeFiles &&
+        params1.includeDeleted === params2.includeDeleted &&
+        params1.includeHidden === params2.includeHidden
+    );
 }
 
 export class ExportRecordModel implements ExportRecord {

client/src/components/History/Export/ExportOptions.vue

@@ -3,14 +3,13 @@ import { BCard, BCollapse, BFormCheckbox, BFormGroup, BFormSelect, BLink } from
 import { computed, reactive, ref } from "vue";
 
 import { AVAILABLE_EXPORT_FORMATS } from "@/api/histories.export";
-import { ExportParamsModel } from "@/components/Common/models/exportRecordModel";
+import type { ExportParams } from "@/components/Common/models/exportRecordModel";
 
-const props = defineProps({
-    exportParams: {
-        type: ExportParamsModel,
-        required: true,
-    },
-});
+interface Props {
+    exportParams: ExportParams;
+}
+
+const props = defineProps<Props>();
 
 const emit = defineEmits(["onValueChanged"]);
 

client/src/components/Workflow/WorkflowActions.vue

@@ -20,6 +20,8 @@ import { useConfirmDialog } from "@/composables/confirmDialog";
 import { Toast } from "@/composables/toast";
 import { useUserStore } from "@/stores/userStore";
 
+import type { ColorVariant } from "../Common";
+
 import AsyncButton from "@/components/Common/AsyncButton.vue";
 
 library.add(faCaretDown, faExternalLinkAlt, faEye, faFileExport, farStar, faStar, faTrash);
@@ -41,7 +43,7 @@ type BaseAction = {
     target?: "_blank";
     size: "sm" | "md" | "lg";
     component: "async" | "button";
-    variant: "primary" | "secondary" | "success" | "danger" | "warning" | "info" | "light" | "dark" | "link";
+    variant: ColorVariant | "link";
     onClick?: (e?: MouseEvent | KeyboardEvent) => void;
 };