fix: get root path util #16

src/composables/image.ts

@@ -1,5 +1,6 @@
 import type { Editor } from "@tiptap/vue-3";
 import { ref } from "vue";
+import { getPublicURL } from "../utils/get-root-path";
 
 type ImageSelection = {
   imageUrl: string;
@@ -26,16 +27,12 @@ export function useImage(editor: Editor) {
   }
 
   function imageSave() {
-    editor
-      .chain()
-      .focus()
-      .setImage({ src: imageSelection.value.imageUrl })
-      .run();
+    editor.chain().focus().setImage({ src: imageSelection.value.imageUrl }).run();
     imageClose();
   }
 
   function imageSelect(image: Record<string, any>) {
-    const assetUrl = 'http://0.0.0.0:8055/assets/' + image.id;
+    const assetUrl = getPublicURL() + "assets/" + image.id;
 
     imageSelection.value = {
       imageUrl: assetUrl,

src/utils/get-root-path.ts

@@ -0,0 +1,26 @@
+/**
+ * Get the API root location from the current window path
+ */
+export function getRootPath(): string {
+  return extract(window.location.pathname);
+}
+
+/**
+ * Get the full API root URL from the current page href
+ */
+export function getPublicURL(): string {
+  return extract(window.location.href);
+}
+
+/**
+ * Extract the root path of the admin app from a given input path/url
+ *
+ * @param path - Path or URL string of the current page
+ * @returns - Root URL of the Directus instance
+ */
+export function extract(path: string) {
+  const parts = path.split("/");
+  const adminIndex = parts.indexOf("admin");
+  const rootPath = parts.slice(0, adminIndex).join("/") + "/";
+  return rootPath;
+}