@synopackageland/cli 0.3.10 → 0.4.1

package/templates/native-go-vue/frontend/package.json

@@ -0,0 +1,6 @@
+{
+  "name": "native-dsm-vue-app", "private": true, "type": "module",
+  "scripts": {"build": "vue-tsc --noEmit && vite build", "test": "vitest run"},
+  "dependencies": {"@synopackageland/ui": "0.4.0", "vue": "3.5.43"},
+  "devDependencies": {"@vitejs/plugin-vue": "6.0.9", "vite": "7.3.6", "typescript": "5.9.3", "vue-tsc": "3.3.11", "vitest": "4.1.11", "jsdom": "26.1.0"}
+}

package/templates/native-go-vue/frontend/src/App.vue

@@ -0,0 +1,159 @@
+<script setup lang="ts">
+import {computed, inject, onMounted, onUnmounted, ref} from 'vue'
+import {AppRoot, Button, Callout, Dialog, SettingsSection, Textarea} from '@synopackageland/ui'
+import {stateCopy, type AppStatus, type Context, type Status} from './context'
+import {NasProviderKey} from './nas/provider'
+import {errorCopy, nasCopy} from './nas/i18n'
+import NasGrantSettings from './nas/NasGrantSettings.vue'
+import NasUnavailable from './nas/NasUnavailable.vue'
+const nasProvider = inject(NasProviderKey, null)
+// A mount owns one provider binding. A native subject/package switch must
+// discard its UI and pending work; the host supplies a new provider on remount.
+const nasInvalidated = ref(false)
+const props = defineProps<{ctx: Context}>()
+const app = ref<AppStatus>()
+const status = ref<Status>()
+const busy = ref(false)
+const error = ref('')
+const notice = ref('')
+const disableOpen = ref(false)
+const id = ref('')
+const text = ref('')
+const identity = ref('')
+let disposed = false
+const refreshing = ref(false)
+let appCookie = ''
+const configured = computed(() => status.value?.reason !== "not-requested")
+const details = computed(() => {
+ if(status.value?.state === 'pending') {
+  const copy = nasCopy(props.ctx.locale)
+  return {label:copy.healthPending,description:copy.healthPendingHelp}
+ }
+ return status.value ? stateCopy[status.value.state] : undefined
+})
+function message(e: unknown) {
+ const code = (e as {code?: string})?.code || 'request_failed'
+ if(['denied','unknown_method','unavailable','unsupported','session_required','auth_unavailable'].includes(code)) return errorCopy(e,nasCopy(props.ctx.locale))
+ return ({session_required:'Your DSM session expired. Sign in again.',access_denied:'This sample belongs to another account.',integration_unavailable:'Integration is unavailable. Ask an administrator to activate or recover it.',personal_unavailable:'Sample storage is unavailable. Ask an administrator to check package data.',root_conflict:'A conflicting scheduler task exists. Ask an administrator to review it.',root_verify_failed:'Scheduler verification failed. Refresh and review the task.',root_run_failed:'The approved operation failed. Review integration status and cleanup.'} as Record<string,string>)[code] || `Request failed (${code}). Refresh and try again.`
+}
+async function refresh() {
+ if(disposed || refreshing.value) return
+ refreshing.value = true; error.value = ''
+ try {
+  const [a,s] = await Promise.all([props.ctx.call<AppStatus>('app.status'),props.ctx.call<Status>('integration.status')])
+  if(disposed) return
+  if(app.value && (app.value.user!==a.user || app.value.package!==a.package)) nasInvalidated.value=true
+  app.value = a; status.value = s
+  if(s.state !== 'ready') {id.value='';text.value='';return}
+  // Plain --ui vue has no personal routes; not-enabled status hides this.
+  const list = await props.ctx.call<{items:Array<{id:string;name:string}>}>('personal.list')
+  if(disposed) return
+  id.value = list.items[0]?.id || ''
+  if(id.value) {
+   const note = await props.ctx.call<{text:string}>('personal.read',{id:id.value})
+   if(!disposed) text.value = note.text
+  }
+ } catch(e) {if(!disposed) {error.value = message(e);status.value=undefined;id.value='';text.value=''}} finally {refreshing.value=false}
+}
+async function action(op: string) {
+ if(busy.value || refreshing.value || disposed) return
+ busy.value=true;error.value='';notice.value=''
+ try {
+  if(!props.ctx.root) throw {code:'unsupported'}
+  const approved = await props.ctx.root.authorize(op)
+  if(disposed) return
+  if(approved !== 'ready') {notice.value='Approval cancelled. No operation was run.';return}
+  await props.ctx.root.run(op)
+  if(disposed) return
+  notice.value=op==='helper_repair' ? 'Cleanup repaired. Use Recover or Approve and activate when ready.' : 'Operation completed. Integration status was checked again.'
+  await refresh()
+ } catch(e) {if(!disposed) {
+  await refresh()
+  if(!disposed) {
+   const code=(e as {code?:string})?.code
+   if(code==='root_cancelled') notice.value='Repair confirmation cancelled. No operation was run.'
+   else error.value=op==='helper_repair' && (code==='root_run_failed' || code==='root_task_failed') ? 'Repair could not verify safe cleanup. Review the package recovery instructions before trying again.' : message(e)
+  }
+ }}
+ finally {if(!disposed) busy.value=false}
+}
+async function save() {
+ if(busy.value || refreshing.value || !id.value || disposed) return
+ busy.value=true;error.value='';notice.value=''
+ try {await props.ctx.call('personal.write',{id:id.value,text:text.value});if(!disposed) notice.value='Your sample note was saved.'}
+ catch(e) {if(!disposed) error.value=message(e)} finally {if(!disposed) busy.value=false}
+}
+async function login() {
+ if(busy.value || refreshing.value || disposed) return
+ busy.value=true;error.value=''
+ try {
+  const result=await props.ctx.call<{cookie:string;user:string}>('identity.login')
+  if(!disposed){appCookie=result.cookie;identity.value=`App session for ${result.user}`}
+ } catch(e) {if(!disposed) error.value=message(e)} finally {if(!disposed) busy.value=false}
+}
+async function checkIdentity() {
+ if(busy.value || refreshing.value || disposed) return
+ busy.value=true;error.value=''
+ try {const result=await props.ctx.call<{user:string}>('identity.current',{cookie:appCookie});if(!disposed) identity.value=`App session for ${result.user}`}
+ catch(e) {if(!disposed) {appCookie='';identity.value='';error.value=message(e)}} finally {if(!disposed) busy.value=false}
+}
+const hasIdentity = ref(false)
+onMounted(async()=>{
+ props.ctx.reopen(()=>{if(!disposed) void refresh()})
+ await refresh()
+ if(disposed || !app.value) return
+ try {const result = await props.ctx.call<{mode:string}>('identity.status');if(!disposed) hasIdentity.value = result.mode==='better-auth'} catch { /* Optional route absent in Go-only. */ }
+})
+onUnmounted(()=>{disposed=true;appCookie='';text.value='';id.value=''})
+</script>
+
+<template>
+ <AppRoot modal-scope="app" style="height: 100%">
+  <main class="integration-app" :aria-busy="busy || refreshing" aria-label="Package settings">
+   <header class="integration-heading">
+    <div><h1>{{ app?.package || 'Package settings' }}</h1><p v-if="app">{{ app.user }} · {{ app.version }}</p></div>
+    <Button variant="secondary" :disabled="busy || refreshing" @click="error=''; refresh()">Refresh</Button>
+   </header>
+   <p v-if="refreshing" role="status">Refreshing status…</p>
+   <p v-else-if="busy" role="status">Completing operation…</p>
+   <Callout v-if="error" tone="danger" title="Action required"><span role="alert">{{ error }}</span></Callout>
+   <p v-if="notice" class="integration-notice" role="status">{{ notice }}</p>
+   <SettingsSection title="DSM integration" :collapsible="false">
+    <div v-if="status && details" :data-integration-state="status.state" class="integration-status" role="status">
+     <h2>{{ details.label }}</h2><p>{{ details.description }}</p>
+     <p v-if="status.cleanup === 'required'">Cleanup is required. Ask an administrator to run teardown or disable. If the helper supervisor was lost, use Repair cleanup and follow the package recovery instructions.</p>
+     <dl><dt>Package running</dt><dd>{{ status.packageRunning }}</dd><dt>Scheduler</dt><dd>{{ status.scheduler }}</dd></dl>
+    </div>
+    <p v-else-if="error" role="status">Status could not be loaded. Refresh to try again.</p>
+    <p v-else role="status">Loading integration status…</p>
+    <div v-if="app?.admin && ctx.root && configured" class="integration-actions">
+     <Button variant="primary" :disabled="busy || refreshing" @click="action('helper_enable')">Approve and activate</Button>
+     <Button variant="secondary" :disabled="busy || refreshing" @click="action('helper_recover')">Recover</Button>
+     <Button variant="secondary" :disabled="busy || refreshing" @click="action('helper_teardown')">Teardown</Button>
+     <Button variant="secondary" :disabled="busy || refreshing" @click="disableOpen=true">Disable</Button>
+     <Button variant="secondary" :disabled="busy || refreshing" @click="action('helper_repair')">Repair cleanup</Button>
+    </div>
+    <p v-if="app?.admin && ctx.root && configured" class="integration-help">Repair cleanup clears verified leftover helper state. It does not restart integration.</p>
+    <Callout v-if="app && !app.admin && status?.state !== 'ready' && status?.state !== 'pending'" title="Administrator action needed">Ask a DSM administrator to open this package's settings. Your login cannot approve root operations.</Callout>
+   </SettingsSection>
+   <SettingsSection v-if="status?.state === 'ready'" title="My sample data" :collapsible="false">
+    <p class="integration-help">This synthetic note belongs to your DSM account and is stored in package data.</p>
+    <p v-if="refreshing" role="status">Loading your sample data…</p>
+    <Callout v-else-if="!id" title="No sample data">Refresh to request your sample data again.</Callout>
+    <label v-if="id" class="integration-field"><span>My sample note</span><Textarea v-model="text" aria-label="My sample note" :disabled="busy || refreshing" /></label>
+    <Button v-if="id" variant="primary" :disabled="busy || refreshing" @click="save">Save my note</Button>
+   </SettingsSection>
+   <NasGrantSettings v-if="nasProvider && app && status && !nasInvalidated" :locale="ctx.locale" />
+   <NasUnavailable v-else :locale="ctx.locale" />
+   <SettingsSection v-if="hasIdentity" title="Optional app identity" :collapsible="false">
+    <p class="integration-help">Your DSM login is checked again for every app session request.</p>
+    <div class="integration-actions"><Button variant="primary" :disabled="busy || refreshing" @click="login">Create app session</Button><Button variant="secondary" :disabled="busy || refreshing || !identity" @click="checkIdentity">Check app session</Button></div>
+    <p v-if="identity" role="status">{{ identity }}</p>
+   </SettingsSection>
+   <Dialog v-model:open="disableOpen" title="Disable integration?" description="New integration requests will be refused before helper cleanup begins.">
+    <p>Your sample data and historical root output are retained. A failed cleanup remains visible.</p>
+    <template #footer><Button variant="secondary" @click="disableOpen=false">Cancel</Button><Button variant="danger" :disabled="busy || refreshing" @click="disableOpen=false; action('helper_disable')">Confirm disable</Button></template>
+   </Dialog>
+  </main>
+ </AppRoot>
+</template>

package/templates/native-go-vue/frontend/src/context.ts

@@ -0,0 +1,56 @@
+export type IntegrationState = 'not-enabled' | 'ready' | 'needs-approval' | 'incompatible' | 'stopped' | 'failed' | 'pending'
+export interface Status {state: IntegrationState; reason?: string; cleanup?: string; packageRunning: string; scheduler: string}
+export interface HostPlatformSnapshot {
+ readonly web: boolean
+ readonly host: 'dsm' | 'standalone-web' | 'unavailable'
+ readonly dsmStandalone: boolean | null
+ readonly dsmLanguage: string | null
+ readonly appLocale: string | null
+ readonly systemVersion: string | null
+ readonly fullVersion: string | null
+ readonly theme: null
+}
+export type HostTitleResult = {status: 'ok'; target: 'dsm-window' | 'document'} |
+ {status: 'unsupported' | 'unavailable' | 'invalid-input' | 'failed'}
+export type HostRequestResult = {status: 'requested'} |
+ {status: 'unsupported' | 'unavailable' | 'invalid-input' | 'blocked' | 'failed'}
+export type HostURLResult = {status: 'requested'; windowHandleAvailable: boolean} |
+ {status: 'unsupported' | 'unavailable' | 'invalid-input' | 'failed'}
+export type HostEvent = 'window-resize' | 'host-theme-change' | 'host-language-change'
+export type HostSubscriptionResult = {status: 'subscribed'; dispose(): void} |
+ {status: 'unsupported' | 'unavailable' | 'invalid-input' | 'failed'}
+export type HostFileNavigationResult = {status: 'requested'; action: 'locate-folder' | 'highlight-file'} |
+ {status: 'unsupported' | 'unavailable' | 'invalid-input' | 'failed'}
+export type HostUnsupportedResult = {status: 'unsupported' | 'unavailable'}
+export interface HostAdapter {
+ platform(): HostPlatformSnapshot
+ setTitle(title: string): HostTitleResult
+ activateWindow(): HostRequestResult
+ requestClose(): HostRequestResult
+ openApp(appId: string): HostRequestResult
+ openURL(url: string): HostURLResult
+ openFileManager(path: string): HostFileNavigationResult
+ revealFile(path: string): HostFileNavigationResult
+ openFile(path: string): HostUnsupportedResult
+ showFileDetails(paths: readonly string[]): HostUnsupportedResult
+ openAppSetting(): HostUnsupportedResult
+ subscribe(event: HostEvent, listener: () => void): HostSubscriptionResult
+ dispose(): void
+}
+export interface Context {
+ call<T = unknown>(method: string, params?: Record<string, unknown>): Promise<T>
+ reopen(fn: () => void): () => void
+ locale: string
+ host: HostAdapter
+ root?: {state(op: string): Promise<string>; authorize(op: string): Promise<string>; run(op: string): Promise<unknown>; remove(op: string): Promise<string>}
+}
+export interface AppStatus {package: string; version: string; user: string; admin: boolean}
+export const stateCopy: Record<IntegrationState, {label: string; description: string}> = {
+ 'not-enabled': {label: 'Not enabled', description: 'An administrator can enable integration for this package.'},
+ pending: {label: 'Temporarily revalidating', description: 'Integration is temporarily revalidating. Wait, then refresh. New access is unavailable until verification completes.'},
+ ready: {label: 'Ready', description: 'The helper passed a fresh trusted health check.'},
+ 'needs-approval': {label: 'Approval required', description: 'Ask an administrator to approve and activate integration.'},
+ incompatible: {label: 'Incompatible', description: 'Inventory or trust checks failed. Ask an administrator to review this package.'},
+ stopped: {label: 'Stopped', description: 'An administrator must recover integration after start or reboot.'},
+ failed: {label: 'Failed', description: 'Integration could not finish. Review cleanup status before retrying.'},
+}

package/templates/native-go-vue/frontend/src/main.ts

@@ -0,0 +1,29 @@
+import {createApp} from 'vue'
+import App from './App.vue'
+import type {Context} from './context'
+import {NasProviderKey, type NasProvider} from './nas/provider'
+import '@synopackageland/ui/themes/dsm7-embedded.css'
+import './style.css'
+
+let mountSequence = 0
+export function mount(root: HTMLElement, ctx: Context, options: {nasProvider?: NasProvider} = {}) {
+ const app = createApp(App, {ctx})
+ // The shipped strict-S1 build never installs a NAS provider. Preview is dev/mock only.
+ if(import.meta.env.DEV && options.nasProvider?.mode === 'mock') app.provide(NasProviderKey, options.nasProvider)
+ // Include the generated package ID, an instance counter and randomness even
+ // across separately loaded bundles. getRandomValues also works on DSM HTTP.
+ app.config.idPrefix = `__PACKAGE__-${++mountSequence}-${crypto.getRandomValues(new Uint32Array(4)).join('-')}`
+ const hadRootClass = root.classList.contains('dsmapp-vue-root')
+ root.classList.add('dsmapp-vue-root')
+ app.mount(root)
+ return {unmount() {app.unmount(); if(!hadRootClass) root.classList.remove('dsmapp-vue-root')}}
+}
+// Register with the existing per-package DSM window loader. Never share a
+// singleton app or user/session state between different mount calls.
+const script = document.currentScript as HTMLScriptElement | null
+const packageID = script?.getAttribute('data-package')
+const host = window as unknown as {DsmPackageApps: Record<string, {mount: typeof mount}>}
+if (packageID) {
+ host.DsmPackageApps = host.DsmPackageApps || {}
+ host.DsmPackageApps[packageID] = {mount}
+}

package/templates/native-go-vue/frontend/src/nas/NasGrantSettings.vue

@@ -0,0 +1,74 @@
+<script setup lang="ts">
+import {computed, inject, onMounted, ref} from 'vue'
+import {Button, Callout, Dialog, SettingsSection} from '@synopackageland/ui'
+import {NasProviderKey, type GrantView, type ScopeKind} from './provider'
+import {actionCopy, errorCopy, nasCopy} from './i18n'
+import {useNasRequest} from './use-request'
+import NasPathPicker from './NasPathPicker.vue'
+
+const props=defineProps<{locale:string}>()
+const provider=inject(NasProviderKey)!
+const copy=computed(()=>nasCopy(props.locale))
+const request=useNasRequest(), {busy,error}=request
+const items=ref<GrantView[]>([]), canManageShared=ref(false), pickerOpen=ref(false), kind=ref<ScopeKind>('user-personal'), revokeTarget=ref<GrantView>(), notice=ref('')
+const revokeOpen=computed({get:()=>!!revokeTarget.value,set:value=>{if(!value){request.cancel();revokeTarget.value=undefined}}})
+async function refresh() {
+ const result=await request.run(signal=>provider.settings(signal))
+ if(result) {items.value=result.items;canManageShared.value=result.canManageShared}
+}
+function choose(scope:ScopeKind) {kind.value=scope;notice.value='';pickerOpen.value=true}
+async function granted() {notice.value=copy.value.noticeCreated;await refresh()}
+function state(item:GrantView) {
+ if(item.effectiveState==='active') return copy.value.active
+ if(item.effectiveState==='suspended') return copy.value.suspended
+ if(item.cleanupRequired) return copy.value.cleanup
+ return item.drained===true?copy.value.revoked:copy.value.draining
+}
+function created(time:number) {
+ try {return new Intl.DateTimeFormat(props.locale.replace('_','-'),{dateStyle:'medium',timeStyle:'short'}).format(time)}
+ catch {return new Intl.DateTimeFormat('en',{dateStyle:'medium',timeStyle:'short'}).format(time)}
+}
+async function revoke() {
+ const target=revokeTarget.value;if(!target) return
+ const result=await request.run(signal=>provider.revoke(target.grantId,target.revision,signal))
+ if(result) {
+  // Only an R receipt sets revoked; only Q sets drained. Timeout is neither.
+  if(result.revoked) {const item=items.value.find(i=>i.grantId===result.grantId);if(item){item.effectiveState='revoked';item.revision=result.grantRevision;item.drained=result.drained}}
+  revokeTarget.value=undefined
+ }
+}
+onMounted(refresh)
+</script>
+
+<template>
+ <SettingsSection :title="copy.title" :collapsible="false" class="nas-settings" :aria-busy="busy">
+  <Callout tone="info" :title="copy.pilotOff">{{ copy.pilotRestrictions }}</Callout>
+  <p v-if="provider.mode === 'mock'" class="integration-help">{{ copy.mock }}</p>
+  <Callout v-if="error" tone="danger" :title="copy.errorTitle" role="alert">{{ errorCopy(error,copy) }}</Callout>
+  <div class="integration-actions">
+   <Button variant="primary" :disabled="busy || pickerOpen" @click="choose('user-personal')">{{ copy.choosePersonal }}</Button>
+   <Button v-if="canManageShared" variant="secondary" :disabled="busy || pickerOpen" @click="choose('app-shared')">{{ copy.chooseShared }}</Button>
+   <Button variant="secondary" :disabled="busy || pickerOpen" @click="refresh">{{ copy.refresh }}</Button>
+  </div>
+  <p v-if="notice" role="status">{{ notice }}</p>
+  <p v-if="busy" role="status">{{ copy.loading }}</p>
+  <p v-else-if="!items.length">{{ copy.emptyGrant }}</p>
+  <ul v-else class="nas-grants">
+   <li v-for="item in items" :key="item.grantId">
+    <div class="nas-grant-heading"><strong>{{ item.displayName }}</strong><Button v-if="item.canRevoke && item.effectiveState !== 'revoked'" variant="secondary" :disabled="busy || pickerOpen" @click="revokeTarget=item">{{ copy.revoke }}</Button></div>
+    <dl class="nas-summary">
+     <dt>{{ copy.scope }}</dt><dd>{{ item.scopeKind === 'user-personal' ? copy.personal : copy.shared }}</dd>
+     <dt>{{ copy.actions }}</dt><dd>{{ actionCopy(item.actions,copy) }}</dd>
+     <dt>{{ copy.state }}</dt><dd role="status">{{ state(item) }}</dd>
+     <dt>{{ copy.createdAt }}</dt><dd>{{ created(item.createdAt) }}</dd>
+    </dl>
+   </li>
+  </ul>
+  <NasPathPicker v-model:open="pickerOpen" :scope-kind="kind" :locale="locale" @granted="granted" />
+  <Dialog v-model:open="revokeOpen" :title="copy.revokeTitle" :description="copy.revokeWarning" :close-label="copy.close">
+   <p>{{ revokeTarget?.displayName }}</p>
+   <Callout v-if="error" tone="danger" :title="copy.errorTitle" role="alert">{{ errorCopy(error,copy) }}</Callout>
+   <template #footer><Button variant="secondary" @click="revokeOpen=false">{{ copy.cancel }}</Button><Button variant="danger" :disabled="busy" @click="revoke">{{ copy.confirmRevoke }}</Button></template>
+  </Dialog>
+ </SettingsSection>
+</template>

package/templates/native-go-vue/frontend/src/nas/NasPathPicker.vue

@@ -0,0 +1,106 @@
+<script setup lang="ts">
+import {computed, inject, onBeforeUnmount, ref, watch} from 'vue'
+import {Button, Callout, DataGrid, Dialog, TreeView, type TreeNode} from '@synopackageland/ui'
+import {NasProviderKey, type FolderEntry, type PickerContext, type PreparedIntent, type GrantHandle, type ScopeKind} from './provider'
+import {actionCopy, errorCopy, format, nasCopy} from './i18n'
+import {useNasRequest} from './use-request'
+
+const props=defineProps<{open:boolean; scopeKind:ScopeKind; locale:string}>()
+const emit=defineEmits<{'update:open':[value:boolean]; granted:[grant:GrantHandle]}>()
+const provider=inject(NasProviderKey)!
+const copy=computed(()=>nasCopy(props.locale))
+const request=useNasRequest(), {busy,error}=request
+const context=ref<PickerContext>(), entries=ref<FolderEntry[]>([]), roots=ref<TreeNode[]>([])
+const path=ref<Array<{id:string;name:string}>>([]), selected=ref<FolderEntry>(), intent=ref<PreparedIntent>(), nextCursor=ref<string>()
+const columns=computed(()=>[{key:'displayName',label:copy.value.folder,width:'65%'},{key:'selection',label:copy.value.selection,width:'35%'}])
+const rows=computed(()=>entries.value.map(e=>({...e})))
+
+function discard() {
+ request.cancel()
+ const id=context.value?.contextId;context.value=undefined
+ entries.value=[];roots.value=[];path.value=[];selected.value=undefined;intent.value=undefined;nextCursor.value=undefined
+ if(id) void provider.cancel(id).catch(()=>{})
+}
+function close() {discard();emit('update:open',false)}
+async function start() {
+ discard()
+ const result=await request.run(async(signal,current)=> {
+  const ctx=await provider.begin(props.scopeKind,signal)
+  // A provider which ignores abort must still have its late context canceled.
+  if(!current() || signal.aborted) {await provider.cancel(ctx.contextId);throw {code:'canceled'}}
+  context.value=ctx
+  return provider.list(ctx.contextId,undefined,undefined,signal)
+ })
+ if(result) {entries.value=result.entries;roots.value=result.entries.map(e=>({id:e.nodeId,label:e.displayName}));nextCursor.value=result.nextCursor}
+}
+async function browse(target:Array<{id:string;name:string}>, more=false) {
+ if(!context.value) return
+ const ctx=context.value, node=target.at(-1)?.id
+ const result=await request.run(signal=>provider.list(ctx.contextId,node,more?nextCursor.value:undefined,signal))
+ if(result) {
+  path.value=target;entries.value=more?[...entries.value,...result.entries]:result.entries
+  // Bound the rendered list too; pages do not grow an unbounded DOM.
+  if(entries.value.length>200) entries.value=entries.value.slice(-200)
+  if(target.length===0) roots.value=entries.value.map(e=>({id:e.nodeId,label:e.displayName}))
+  nextCursor.value=result.nextCursor;selected.value=undefined;intent.value=undefined
+ }
+}
+function openFolder(id:string,name:string) {void browse([...path.value,{id,name}])}
+async function review() {
+ if(!selected.value) return
+ const result=await request.run(signal=>provider.prepare(selected.value!.nodeId,signal))
+ if(result) intent.value=result
+}
+async function confirm() {
+ if(!intent.value) return
+ const prepared=intent.value
+ const result=await request.run(signal=>provider.confirm(prepared.intentId,prepared.summaryDigest,signal))
+ if(result) {emit('granted',result);close()}
+}
+watch(()=>props.open,open=>{if(open) void start();else discard()},{immediate:true})
+watch(()=>props.scopeKind,()=>{if(props.open) void start()})
+onBeforeUnmount(discard)
+</script>
+
+<template>
+ <Dialog :open="open" :title="intent ? copy.summaryTitle : copy.pickerTitle" :description="copy.pickerHelp" :close-label="copy.close" width="720px" @update:open="value => {if(!value) close()}">
+  <div class="nas-picker" :aria-busy="busy">
+   <p v-if="provider.mode === 'mock'" class="integration-help">{{ copy.mock }}</p>
+   <Callout v-if="error" tone="danger" :title="copy.errorTitle" role="alert">{{ errorCopy(error,copy) }}</Callout>
+   <p v-if="busy" role="status">{{ copy.loading }}</p>
+   <template v-if="intent">
+    <dl class="nas-summary">
+     <dt>{{ copy.app }}</dt><dd>{{ intent.summary.appName }}</dd>
+     <dt>{{ copy.scope }}</dt><dd>{{ intent.summary.scopeKind === 'user-personal' ? copy.personal : copy.shared }}</dd>
+     <dt>{{ copy.folder }}</dt><dd>{{ intent.summary.displayName }}</dd>
+     <dt>{{ copy.actions }}</dt><dd>{{ actionCopy(intent.summary.actions,copy) }}</dd>
+    </dl>
+    <p>{{ copy.persistent }}</p><p>{{ copy.revokeHow }}</p><p>{{ copy.expires }}</p>
+   </template>
+   <template v-else-if="context">
+    <nav class="nas-breadcrumb" :aria-label="copy.folder">
+     <Button v-if="path.length" variant="secondary" :disabled="busy" @click="browse(path.slice(0,-1))">{{ copy.back }}</Button>
+     <Button variant="secondary" :disabled="busy" @click="browse([])">{{ copy.roots }}</Button>
+     <Button v-for="(part,index) in path" :key="part.id" variant="secondary" :disabled="busy" @click="browse(path.slice(0,index+1))">{{ part.name }}</Button>
+    </nav>
+    <div class="nas-browser">
+     <aside class="nas-tree" :aria-label="copy.roots" :inert="busy || undefined"><TreeView :nodes="roots" :show-icons="false" @select="node => browse([{id:node.id,name:node.label}])" /></aside>
+     <div class="nas-folder-list">
+      <DataGrid :columns="columns" :rows="rows" row-key="nodeId" :footer="false" :labels="{empty:copy.emptyFolder}" :resizable="false" :loading="busy" :loading-text="copy.loading">
+       <template #cell-displayName="{row}"><Button variant="secondary" class="nas-folder-name" :disabled="busy" @click="openFolder(String(row.nodeId),String(row.displayName))">{{ format(copy.open,String(row.displayName)) }}</Button></template>
+       <template #cell-selection="{row}"><Button variant="secondary" class="nas-folder-action" :disabled="busy || !row.selectable" :aria-label="format(copy.select,String(row.displayName))" :aria-pressed="selected?.nodeId === row.nodeId" @click="selected=entries.find(e=>e.nodeId===row.nodeId)">{{ copy.selection }}</Button></template>
+      </DataGrid>
+      <Button v-if="nextCursor" variant="secondary" :disabled="busy" @click="browse(path,true)">{{ copy.loadMore }}</Button>
+     </div>
+    </div>
+    <p v-if="selected" role="status">{{ format(copy.selected,selected.displayName) }}</p>
+   </template>
+  </div>
+  <template #footer>
+   <Button variant="secondary" @click="close">{{ copy.cancel }}</Button>
+   <Button v-if="!context && !busy" variant="secondary" @click="start">{{ copy.retry }}</Button>
+   <Button v-if="intent" variant="primary" :disabled="busy" @click="confirm">{{ copy.confirm }}</Button>
+   <Button v-else variant="primary" :disabled="busy || !selected" @click="review">{{ copy.review }}</Button>
+  </template>
+ </Dialog>
+</template>

package/templates/native-go-vue/frontend/src/nas/NasUnavailable.vue

@@ -0,0 +1,20 @@
+<script setup lang="ts">
+import {computed} from 'vue'
+import {Callout, SettingsSection} from '@synopackageland/ui'
+import {nasCopy} from './i18n'
+const props=defineProps<{locale:string}>()
+const copy=computed(()=>nasCopy(props.locale))
+</script>
+
+<template>
+ <SettingsSection :title="copy.title" :collapsible="false" data-nas-state="unavailable">
+  <Callout :title="copy.unavailableTitle">
+   <p>{{ copy.unavailableMessage }}</p>
+   <p>{{ copy.pilotUnavailable }}</p>
+   <p>{{ copy.noUnlock }}</p>
+   <p>{{ copy.relaxedRisk }}</p>
+   <p>{{ copy.relaxedReauthorize }}</p>
+   <p>{{ copy.relaxedPermissions }}</p>
+  </Callout>
+ </SettingsSection>
+</template>

package/templates/native-go-vue/frontend/src/nas/i18n/de.json

@@ -0,0 +1,74 @@
+{
+  "title": "NAS-Ordnerzugriff",
+  "mock": "Mock-Vorschau — NAS-Dateien und Berechtigungen bleiben unverändert.",
+  "personal": "Meine Ordner",
+  "shared": "Gemeinsame App-Ordner",
+  "choosePersonal": "Eigenen Ordner wählen",
+  "chooseShared": "Gemeinsamen Ordner wählen",
+  "refresh": "Zugriff aktualisieren",
+  "emptyGrant": "Keine Ordner freigegeben. Wählen Sie einen Ordner für die Vorschau des Lesezugriffs.",
+  "pickerTitle": "NAS-Ordner wählen",
+  "pickerHelp": "Ordner durchsuchen, auswählen und den Lesezugriff prüfen.",
+  "roots": "Ordner",
+  "back": "Zurück",
+  "open": "{name} öffnen",
+  "select": "{name} auswählen",
+  "selected": "Ausgewählt: {name}",
+  "review": "Zugriff prüfen",
+  "cancel": "Abbrechen",
+  "confirm": "Zugriff bestätigen",
+  "summaryTitle": "Ordnerzugriff prüfen",
+  "app": "App",
+  "scope": "Bereich",
+  "folder": "Ordner",
+  "actions": "Erlaubte Aktionen",
+  "readOnly": "Ordner auflisten, Metadaten prüfen und Dateien lesen",
+  "persistent": "Dauerhafter Zugriff bis zum Widerruf oder bis die Bindung ungültig wird.",
+  "revokeHow": "Widerrufen Sie einzelne Ordner hier. Eine neue Freigabe erzeugt einen neuen Grant.",
+  "expires": "Innerhalb von 30 Sekunden bestätigen.",
+  "loading": "Ordner werden geladen…",
+  "emptyFolder": "Dieser Ordner ist leer",
+  "loadMore": "Mehr laden",
+  "state": "Zugriffsstatus",
+  "active": "Aktiv",
+  "suspended": "Ausgesetzt — erneut auswählen und freigeben",
+  "revoked": "Widerrufen",
+  "draining": "Widerrufen; Übertragungen werden gestoppt",
+  "cleanup": "Widerrufen; Bereinigung muss geprüft werden",
+  "createdAt": "Erstellt",
+  "revoke": "Widerrufen",
+  "revokeTitle": "Ordnerzugriff widerrufen?",
+  "revokeWarning": "Neuen Zugriff und laufende Übertragungen stoppen. Bereits gesendete oder geschriebene Daten werden nicht zurückgesetzt.",
+  "confirmRevoke": "Widerruf bestätigen",
+  "noticeCreated": "Ordnerzugriff hinzugefügt.",
+  "errorTitle": "Ordnerzugriff konnte nicht aktualisiert werden",
+  "errorDenied": "Zugriff verweigert. Wählen Sie einen für Ihr aktuelles Konto sichtbaren Ordner.",
+  "errorExpired": "Auswahl oder Bestätigung abgelaufen. Abbrechen und den Ordner erneut wählen.",
+  "errorStale": "Sitzung oder Auswahl geändert. Abbrechen und den Ordner erneut wählen.",
+  "errorUnavailable": "Ordnerdienst nicht verfügbar. Bitten Sie einen Administrator, Integration und Home-Dienste zu prüfen.",
+  "errorBusy": "Anfragelimit erreicht. Warten Sie und versuchen Sie es erneut.",
+  "errorCanceled": "Anfrage abgebrochen. Wählen Sie den Ordner erneut, wenn Sie bereit sind.",
+  "errorInternal": "Anfrage fehlgeschlagen. Aktualisieren Sie den Zugriff vor einem neuen Versuch.",
+  "retry": "Erneut versuchen",
+  "close": "Schließen",
+  "selection": "Ordner auswählen",
+  "actionList": "Ordner auflisten",
+  "actionStat": "Metadaten prüfen",
+  "actionRead": "Dateien lesen",
+  "pilotOff": "Pilot für verwaltete Konten: aus",
+  "pilotRestrictions": "Die Freigabe durch einen Administrator und ein geprüfter Ablauf zur Kontenpflege sind erforderlich. Kontoänderungen oder eine ungeprüfte Identität entziehen den Zugriff und erfordern eine neue Anmeldung und Freigabe. Diese Version kann den Pilotbetrieb nicht aktivieren.",
+  "unavailableTitle": "Noch nicht verfügbar",
+  "unavailableMessage": "NAS-Ordnerfreigaben und Dateioperationen sind noch nicht verfügbar. Die erforderlichen nativen Identitäts- und Berechtigungsnachweise können derzeit nicht geprüft werden.",
+  "pilotUnavailable": "Der Pilot B für verwaltete Konten ist experimental und kann nicht aktiviert werden.",
+  "noUnlock": "Das Aktivieren der Integration oder erneutes Anmelden schaltet den NAS-Dateizugriff nicht frei.",
+  "errorUnknownMethod": "Diese Paketversion stellt diese Methode nicht bereit.",
+  "errorNativeProof": "Der erforderliche native Identitäts- oder Berechtigungsnachweis fehlt. Der NAS-Zugriff bleibt gesperrt.",
+  "errorSession": "Ihre DSM-Sitzung ist abgelaufen. Melden Sie sich erneut für die App-Sitzung an; der NAS-Dateizugriff bleibt nicht verfügbar.",
+  "errorAuthentication": "Die DSM-Authentifizierung ist nicht verfügbar. Aktualisieren Sie den App-Status später.",
+  "errorUnsupported": "NAS-Dateioperationen sind in diesem Build nicht verfügbar.",
+  "healthPending": "Vorübergehende erneute Prüfung",
+  "healthPendingHelp": "Die Integration wird vorübergehend erneut geprüft. Warten Sie und aktualisieren Sie anschließend. Neuer Zugriff ist erst nach Abschluss der Prüfung möglich.",
+  "relaxedRisk": "Bei gelockerter Identität können mit derselben UID und demselben username neu erstellte Konten bestehende Freigaben übernehmen.",
+  "relaxedReauthorize": "Ändert sich die UID oder der username, werden alle Ihre Freigaben ungültig und müssen erneut genehmigt werden.",
+  "relaxedPermissions": "Dateioperationen verwenden Ihre UID und Gruppen und bleiben auf NAS-Berechtigungen und genehmigte Ordner beschränkt. Deaktivierte Konten oder entzogene App-Berechtigungen führen zur Zugriffsverweigerung."
+}

package/templates/native-go-vue/frontend/src/nas/i18n/en.json

@@ -0,0 +1,74 @@
+{
+  "title": "NAS folder access",
+  "mock": "Mock preview — no NAS files or permissions are changed.",
+  "personal": "My folders",
+  "shared": "App shared folders",
+  "choosePersonal": "Choose my folder",
+  "chooseShared": "Choose shared folder",
+  "refresh": "Refresh access",
+  "emptyGrant": "No folders authorized. Choose a folder to preview read-only access.",
+  "pickerTitle": "Choose a NAS folder",
+  "pickerHelp": "Browse folders, select one, then review read-only access.",
+  "roots": "Folders",
+  "back": "Back",
+  "open": "Open {name}",
+  "select": "Select {name}",
+  "selected": "Selected: {name}",
+  "review": "Review access",
+  "cancel": "Cancel",
+  "confirm": "Confirm access",
+  "summaryTitle": "Review folder access",
+  "app": "App",
+  "scope": "Scope",
+  "folder": "Folder",
+  "actions": "Allowed actions",
+  "readOnly": "List folders, inspect metadata and read files",
+  "persistent": "Persistent access — until you revoke it or its binding becomes invalid.",
+  "revokeHow": "Revoke individual folders here. Reauthorization creates a new grant.",
+  "expires": "Confirm within 30 seconds.",
+  "loading": "Loading folders…",
+  "emptyFolder": "This folder is empty",
+  "loadMore": "Load more",
+  "state": "Access state",
+  "active": "Active",
+  "suspended": "Suspended — select again to authorize",
+  "revoked": "Revoked",
+  "draining": "Revoked; stopping transfers",
+  "cleanup": "Revoked; cleanup needs verification",
+  "createdAt": "Created",
+  "revoke": "Revoke",
+  "revokeTitle": "Revoke folder access?",
+  "revokeWarning": "Stop new access and in-progress transfers. Data already sent or written will not be restored.",
+  "confirmRevoke": "Confirm revoke",
+  "noticeCreated": "Folder access added.",
+  "errorTitle": "Folder access could not be updated",
+  "errorDenied": "Access denied. Choose a folder visible to your current account.",
+  "errorExpired": "The selection or confirmation expired. Cancel and choose the folder again.",
+  "errorStale": "Your session or selection changed. Cancel and choose the folder again.",
+  "errorUnavailable": "Folder service is unavailable. Ask an administrator to check integration and home services.",
+  "errorBusy": "The request limit was reached. Wait, then retry.",
+  "errorCanceled": "The request was canceled. Choose the folder again when ready.",
+  "errorInternal": "The request failed. Refresh access before trying again.",
+  "retry": "Retry",
+  "close": "Close",
+  "selection": "Select folder",
+  "actionList": "List folders",
+  "actionStat": "Inspect metadata",
+  "actionRead": "Read files",
+  "pilotOff": "Managed account pilot: off",
+  "pilotRestrictions": "Administrator approval and a verified account-maintenance process are required. Account changes or unverified identity revoke access and require a new sign-in and approval. Enabling this pilot is unavailable in this build.",
+  "unavailableTitle": "Not available yet",
+  "unavailableMessage": "NAS folder grants and file operations are not available yet. Required native identity and permission proof cannot currently be verified.",
+  "pilotUnavailable": "Managed account pilot B is experimental and cannot be enabled.",
+  "noUnlock": "Enabling integration or signing in again does not unlock NAS file access.",
+  "errorUnknownMethod": "This method is not provided by this package version.",
+  "errorNativeProof": "Required native identity or permission proof is unavailable. NAS access remains closed.",
+  "errorSession": "Your DSM session expired. Sign in to restore the app session; NAS file access remains unavailable.",
+  "errorAuthentication": "DSM authentication is unavailable. Refresh the app status later.",
+  "errorUnsupported": "NAS file operations are not available in this build.",
+  "healthPending": "Temporarily revalidating",
+  "healthPendingHelp": "Integration is temporarily revalidating. Wait, then refresh. New access is unavailable until verification completes.",
+  "relaxedRisk": "When relaxed identity is selected, accounts recreated with the same UID and username may retain grants.",
+  "relaxedReauthorize": "A UID or username change invalidates all your grants and requires new authorization.",
+  "relaxedPermissions": "File operations use your UID and groups, within NAS permissions and authorized folders. Disabled accounts or revoked app access are denied."
+}