From 95d8b1fbf4bebdcec06845dcd4d3cbe9b1956815 Mon Sep 17 00:00:00 2001
From: John Chilton <jmchilton@gmail.com>
Date: Sun, 22 Dec 2024 14:17:26 -0500
Subject: [PATCH] Refactor no items message out of collection creator for
 reuse.

---
 .../Collections/common/CollectionCreator.vue   | 11 +++--------
 .../common/CollectionCreatorNoItemsMessage.vue | 18 ++++++++++++++++++
 2 files changed, 21 insertions(+), 8 deletions(-)
 create mode 100644 client/src/components/Collections/common/CollectionCreatorNoItemsMessage.vue

diff --git a/client/src/components/Collections/common/CollectionCreator.vue b/client/src/components/Collections/common/CollectionCreator.vue
index c20ea07e3ac2..74f7fd98b91e 100644
--- a/client/src/components/Collections/common/CollectionCreator.vue
+++ b/client/src/components/Collections/common/CollectionCreator.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { faPlus, faUpload } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
-import { BAlert, BLink, BTab, BTabs } from "bootstrap-vue";
+import { BAlert, BTab, BTabs } from "bootstrap-vue";
 import { storeToRefs } from "pinia";
 import { computed, ref, watch } from "vue";
 
@@ -15,6 +15,7 @@ import { orList } from "@/utils/strings";
 
 import CollectionCreatorFooterButtons from "./CollectionCreatorFooterButtons.vue";
 import CollectionCreatorHelpHeader from "./CollectionCreatorHelpHeader.vue";
+import CollectionCreatorNoItemsMessage from "./CollectionCreatorNoItemsMessage.vue";
 import CollectionCreatorShowExtensions from "./CollectionCreatorShowExtensions.vue";
 import CollectionCreatorSourceOptions from "./CollectionCreatorSourceOptions.vue";
 import CollectionNameInput from "./CollectionNameInput.vue";
@@ -149,13 +150,7 @@ watch(
     <BTabs v-model="currentTab" fill justified>
         <BTab class="collection-creator" :title="localize('Create Collection')">
             <div v-if="props.noItems">
-                <BAlert variant="info" show>
-                    {{ localize("No items available to create a collection.") }}
-                    {{ localize("Exit and change your current history, or") }}
-                    <BLink class="text-decoration-none" @click.stop.prevent="currentTab = Tabs.upload">
-                        {{ localize("Upload some datasets.") }}
-                    </BLink>
-                </BAlert>
+                <CollectionCreatorNoItemsMessage @click-upload="currentTab = Tabs.upload" />
             </div>
             <div v-else>
                 <CollectionCreatorHelpHeader>
diff --git a/client/src/components/Collections/common/CollectionCreatorNoItemsMessage.vue b/client/src/components/Collections/common/CollectionCreatorNoItemsMessage.vue
new file mode 100644
index 000000000000..b525f3a28360
--- /dev/null
+++ b/client/src/components/Collections/common/CollectionCreatorNoItemsMessage.vue
@@ -0,0 +1,18 @@
+<script setup lang="ts">
+import { BAlert, BLink } from "bootstrap-vue";
+
+import localize from "@/utils/localization";
+
+const emit = defineEmits<{
+    (e: "clicked-upload"): void;
+}>();
+</script>
+<template>
+    <BAlert variant="info" show>
+        {{ localize("No items available to create a collection.") }}
+        {{ localize("Exit and change your current history, or") }}
+        <BLink class="text-decoration-none" @click.stop.prevent="emit('clicked-upload')">
+            {{ localize("Upload some datasets.") }}
+        </BLink>
+    </BAlert>
+</template>