refactor: move node-share to app

src/App.vue

@@ -46,7 +46,8 @@
     <Settings :open.sync="settingsOpen" />
 
     <Sidebar />
-    <EditMetadata />
+    <EditMetadataModal />
+    <NodeShareModal />
   </NcContent>
 </template>
 
@@ -68,7 +69,8 @@ import Settings from "./components/Settings.vue";
 import FirstStart from "./components/FirstStart.vue";
 import Metadata from "./components/Metadata.vue";
 import Sidebar from "./components/Sidebar.vue";
-import EditMetadata from "./components/modal/EditMetadataModal.vue";
+import EditMetadataModal from "./components/modal/EditMetadataModal.vue";
+import NodeShareModal from "./components/modal/NodeShareModal.vue";
 
 import ImageMultiple from "vue-material-design-icons/ImageMultiple.vue";
 import FolderIcon from "vue-material-design-icons/Folder.vue";
@@ -95,7 +97,8 @@ export default defineComponent({
     Settings,
     FirstStart,
     Sidebar,
-    EditMetadata,
+    EditMetadataModal,
+    NodeShareModal,
 
     ImageMultiple,
     FolderIcon,

src/components/Sidebar.vue

@@ -150,6 +150,7 @@ aside.app-sidebar {
 // Prevent sidebar from becoming too big
 aside.app-sidebar {
   max-width: 360px !important;
+  position: fixed !important;
 
   @media (max-width: 512px) {
     max-width: unset !important;

src/components/modal/NodeShareModal.vue

@@ -91,7 +91,6 @@ import { API } from "../../services/API";
 
 import CloseIcon from "vue-material-design-icons/Close.vue";
 import LinkIcon from "vue-material-design-icons/LinkVariant.vue";
-import { IPhoto } from "../../types";
 
 type IShare = {
   id: string;
@@ -132,24 +131,13 @@ export default defineComponent({
   },
 
   created() {
-    subscribe("update:share", this.refreshUrls);
-  },
-
-  beforeDestroy() {
-    unsubscribe("update:share", this.refreshUrls);
+    globalThis.shareNodeLink = (path: string) => {
+      this.filename = path;
+      this.open();
+    };
   },
 
   methods: {
-    openFolder() {
-      this.filename = utils.getFolderRoutePath(this.config_foldersPath);
-      this.open();
-    },
-
-    openPhoto(photo: IPhoto) {
-      this.filename = photo.filename;
-      this.open();
-    },
-
     open() {
       this.show = true;
       globalThis.mSidebar.setTab("sharing");

src/components/top-matter/FolderTopMatter.vue

@@ -32,7 +32,7 @@
         </NcActionRouter>
         <NcActionButton
           :aria-label="t('memories', 'Share folder')"
-          @click="$refs.shareModal.openFolder()"
+          @click="share()"
           close-after-click
         >
           {{ t("memories", "Share folder") }}
@@ -40,8 +40,6 @@
         </NcActionButton>
       </NcActions>
     </div>
-
-    <NodeShareModal ref="shareModal" />
   </div>
 </template>
 
@@ -49,6 +47,7 @@
 import { defineComponent } from "vue";
 import { TopMatterFolder, TopMatterType } from "../../types";
 
+import UserConfig from "../../mixins/UserConfig";
 const NcBreadcrumbs = () =>
   import("@nextcloud/vue/dist/Components/NcBreadcrumbs");
 const NcBreadcrumb = () =>
@@ -57,7 +56,7 @@ import NcActions from "@nextcloud/vue/dist/Components/NcActions";
 import NcActionButton from "@nextcloud/vue/dist/Components/NcActionButton";
 import NcActionRouter from "@nextcloud/vue/dist/Components/NcActionRouter";
 
-import NodeShareModal from "../modal/NodeShareModal.vue";
+import * as utils from "../../services/Utils";
 
 import HomeIcon from "vue-material-design-icons/Home.vue";
 import ShareIcon from "vue-material-design-icons/ShareVariant.vue";
@@ -72,13 +71,14 @@ export default defineComponent({
     NcActions,
     NcActionButton,
     NcActionRouter,
-    NodeShareModal,
     HomeIcon,
     ShareIcon,
     TimelineIcon,
     FoldersIcon,
   },
 
+  mixins: [UserConfig],
+
   data: () => ({
     topMatter: null as TopMatterFolder | null,
     recursive: false,
@@ -119,6 +119,12 @@ export default defineComponent({
         this.recursive = false;
       }
     },
+
+    share() {
+      globalThis.shareNodeLink(
+        utils.getFolderRoutePath(this.config_foldersPath)
+      );
+    },
   },
 });
 </script>

src/main.ts

@@ -23,6 +23,7 @@ declare global {
   var OCP: Nextcloud.v24.OCP;
 
   var editMetadata: (photos: IPhoto[], sections?: number[]) => void;
+  var shareNodeLink: (path: string) => void;
 
   var mSidebar: {
     open: (filename: IFileInfo) => void;