From 98bddac1bd13baf774ae48e7fcd9ac62ae582508 Mon Sep 17 00:00:00 2001 From: joshuaboud Date: Mon, 30 May 2022 16:23:40 -0300 Subject: [PATCH] implement browsing on alternate host --- navigator/src/main.js | 7 +- navigator/src/router/index.js | 8 +- navigator/src/views/Browser.vue | 132 +++++++++++++------------------- 3 files changed, 63 insertions(+), 84 deletions(-) diff --git a/navigator/src/main.js b/navigator/src/main.js index 0f18ac1..70af658 100644 --- a/navigator/src/main.js +++ b/navigator/src/main.js @@ -41,15 +41,14 @@ router.beforeEach(async (to, from) => { if (to.fullPath === lastValidRoutePath) { return true; // ignore from updating window.location.hash } + const host = to.params.host?.replace(/^\/|:$/g, '') ?? undefined; if (to.name === 'browse') { - if (!to.params.path) - return "/browse/"; // force / for opening root try { - let realPath = (await useSpawn(['realpath', '--canonicalize-existing', to.params.path], { superuser: 'try' }).promise()).stdout.trim(); + let realPath = (await useSpawn(['realpath', '--canonicalize-existing', to.params.path], { superuser: 'try', host }).promise()).stdout.trim(); if (to.params.path !== realPath) return `/browse${realPath}`; try { - await useSpawn(['test', '-r', to.params.path, '-a', '-x', to.params.path], { superuser: 'try' }).promise(); + await useSpawn(['test', '-r', to.params.path, '-a', '-x', to.params.path], { superuser: 'try', host }).promise(); } catch { throw new Error(`Permission denied for ${to.params.path}`); } diff --git a/navigator/src/router/index.js b/navigator/src/router/index.js index f831527..988363d 100644 --- a/navigator/src/router/index.js +++ b/navigator/src/router/index.js @@ -2,12 +2,16 @@ import { createRouter, createWebHashHistory } from 'vue-router'; const routes = [ { - path: '/browse:host(/[^/:]+:)?:path(/.*)?', + path: '/browse:host(/[^/:]+:?[0-9]*:)?:path(/.*)', name: 'browse', component: () => import('../views/Browser.vue'), }, { - path: '/edit:path(/.+)', + path: '/browse:host(/[^/:]+:?[0-9]*:)?', + redirect: route => `${route.fullPath}/` + }, + { + path: '/edit:host(/[^/:]+:?[0-9]*:)?:path(/.+)', name: 'edit', component: () => import('../views/Editor.vue'), }, diff --git a/navigator/src/views/Browser.vue b/navigator/src/views/Browser.vue index 8757d69..3f3115a 100644 --- a/navigator/src/views/Browser.vue +++ b/navigator/src/views/Browser.vue @@ -2,62 +2,44 @@
+ class="grid grid-cols-[auto_1fr] grid-rows-[1fr 1fr] md:grid-cols-[auto_3fr_1fr] md:grid-row-[1fr] items-stretch divide-x divide-y divide-default">
- - -
- + class="p-1 md:px-4 md:py-2 col-start-1 col-end-3 row-start-2 row-end-3 md:col-start-auto md:col-end-auto md:row-start-auto md:row-end-auto"> +
@@ -76,24 +58,16 @@
- +
- + ref="directoryViewRef" />
@@ -147,24 +121,27 @@ export default { } }); - const cd = (newPath) => { - router.push(`/browse${newPath}`); + const cd = ({ path, host }) => { + const newHost = host ?? (route.params.host ? pathHistory.current().host : undefined); + router.push(`/browse${newHost ? `/${newHost}:` : ''}${path}`); }; const back = () => { - cd(pathHistory.back() ?? '/'); + cd(pathHistory.back() ?? { path: '/' }); } const forward = () => { - cd(pathHistory.forward() ?? '/'); + cd(pathHistory.forward() ?? { path: '/' }); } const up = () => { - cd((pathHistory.current() ?? "") + '/..'); + const path = pathHistory.current() ?? { path: '/' }; + path.path += '/..'; + cd(path); } const openEditor = (path) => { - router.push(`/edit${path}`); + router.push(`/edit${route.params.host ? `/${pathHistory.current().host}:` : ''}${path}`); } const getSelected = () => directoryViewRef.value?.getSelected?.() ?? []; @@ -179,15 +156,14 @@ export default { ); }, { immediate: true }); - watch(() => route.params.path, async (newPath, lastPath) => { - if (!lastPath) { - console.log("First watch execute", lastPath); - } - if (route.name !== 'browse' || newPath === lastPath) + watch([() => route.params.path, () => route.params.host], async () => { + if (route.name !== 'browse') return; - localStorage.setItem(lastPathStorageKey, newPath); - if (pathHistory.current() !== newPath) { - pathHistory.push(newPath); // updates actual view + const host = route.params.host?.replace(/^\/|:$/g, '') || cockpit.transport.host; + console.log(route.params.host); + localStorage.setItem(lastPathStorageKey, route.params.path); + if (pathHistory.current()?.path !== route.params.path || pathHistory.current()?.host !== host) { + pathHistory.push({ path: route.params.path, host }); // updates actual view } }, { immediate: true });