release: v1.2.0 — unified images/ storage and legacy migration

Consolidate local images under data/images/, add docker migrate CLI,
startup index sync with orphan cleanup, and remove upload folder UI/API.

app/components/ApiCurlBlock.vue

@@ -0,0 +1,53 @@
+<script setup lang="ts">
+const props = withDefaults(
+  defineProps<{
+    code: string
+    scrollable?: boolean
+  }>(),
+  {
+    scrollable: true
+  }
+)
+
+const toast = useToast()
+const { t } = useI18n()
+
+async function copyCode() {
+  try {
+    await navigator.clipboard.writeText(props.code)
+    toast.add({ title: t('copy.curl'), color: 'success' })
+  } catch {
+    toast.add({ title: t('copy.failed'), color: 'error' })
+  }
+}
+</script>
+
+<template>
+  <div class="overflow-hidden rounded-xl bg-neutral-950">
+    <div
+      class="flex items-center justify-between border-b border-neutral-800/80 bg-neutral-900 px-3.5 py-2.5"
+    >
+      <div
+        class="flex items-center gap-2"
+        aria-hidden="true"
+      >
+        <span class="size-3 rounded-full border border-black/15 bg-[#ff5f56]" />
+        <span class="size-3 rounded-full border border-black/15 bg-[#ffbd2e]" />
+        <span class="size-3 rounded-full border border-black/15 bg-[#27c93f]" />
+      </div>
+      <UButton
+        icon="i-lucide-copy"
+        :label="t('common.copy')"
+        size="xs"
+        variant="ghost"
+        color="neutral"
+        class="text-neutral-300 hover:text-white"
+        @click="copyCode"
+      />
+    </div>
+    <pre
+      class="overflow-auto p-4 text-xs leading-relaxed text-neutral-100"
+      :class="props.scrollable ? 'max-h-80' : ''"
+    ><code class="font-mono">{{ props.code }}</code></pre>
+  </div>
+</template>

app/components/ImageCard.vue

@@ -1,7 +1,6 @@
 <script setup lang="ts">
 import type { ImageItem } from '~/types/image'
-
-type CopyFormat = 'url' | 'markdown' | 'html'
+import type { CopyFormat } from '~/composables/useUploadPreferences'
 
 const props = withDefaults(defineProps<{
   image: ImageItem
@@ -25,9 +24,13 @@ const emit = defineEmits<{
 
 const { formatFileSize } = useFileSize()
 const { t, locale } = useI18n()
+const { copyFormat } = useUploadPreferences()
 const imageError = ref(false)
 const retryCount = ref(0)
-const copyFormat = ref<CopyFormat>('url')
+
+function selectCopyFormat(value: CopyFormat) {
+  copyFormat.value = value
+}
 
 const MAX_PREVIEW_RETRIES = 3
 const PREVIEW_RETRY_DELAYS_MS = [1000, 2000, 4000]
@@ -231,7 +234,7 @@ function toggleSelected(value: boolean | 'indeterminate') {
           :variant="copyFormat === item.value ? 'solid' : 'ghost'"
           :color="copyFormat === item.value ? 'primary' : 'neutral'"
           :label="item.label"
-          @click="() => { copyFormat = item.value }"
+          @click="selectCopyFormat(item.value)"
         />
       </div>
 

app/components/StatsDonut.vue

@@ -1,111 +0,0 @@
-<script setup lang="ts">
-export interface DonutSegment {
-  label: string
-  value: number
-  color: string
-}
-
-const props = defineProps<{
-  segments: DonutSegment[]
-  size?: number
-}>()
-
-const total = computed(() =>
-  props.segments.reduce((sum, item) => sum + item.value, 0)
-)
-
-const gradient = computed(() => {
-  if (!total.value) {
-    return 'conic-gradient(var(--ui-bg-muted) 0% 100%)'
-  }
-
-  let offset = 0
-  const stops = props.segments
-    .filter(item => item.value > 0)
-    .map((item) => {
-      const start = offset
-      const percent = (item.value / total.value) * 100
-      offset += percent
-      return `${item.color} ${start}% ${offset}%`
-    })
-
-  if (!stops.length) {
-    return 'conic-gradient(var(--ui-bg-muted) 0% 100%)'
-  }
-
-  return `conic-gradient(${stops.join(', ')})`
-})
-
-function percent(value: number) {
-  if (!total.value) return 0
-  return Math.round((value / total.value) * 100)
-}
-
-function formatCount(value: number) {
-  if (value >= 100000000) {
-    return `${(value / 100000000).toFixed(value >= 1000000000 ? 0 : 1)}亿`
-  }
-  if (value >= 10000) {
-    return `${(value / 10000).toFixed(value >= 100000 ? 0 : 1)}万`
-  }
-  return String(value)
-}
-
-const centerText = computed(() => formatCount(total.value))
-
-const centerTextClass = computed(() => {
-  const raw = String(total.value)
-  if (raw.length >= 7) return 'text-[9px] font-semibold leading-none'
-  if (raw.length >= 5) return 'text-xs font-semibold leading-none'
-  if (raw.length >= 4) return 'text-sm font-semibold leading-none'
-  return 'text-lg font-semibold leading-none'
-})
-</script>
-
-<template>
-  <div class="flex items-center gap-4">
-    <div
-      class="relative shrink-0 rounded-full"
-      :style="{
-        width: `${size ?? 88}px`,
-        height: `${size ?? 88}px`,
-        background: gradient
-      }"
-    >
-      <div
-        class="absolute inset-[20%] flex flex-col items-center justify-center rounded-full bg-elevated px-1 text-center"
-      >
-        <p
-          class="max-w-full truncate tabular-nums"
-          :class="centerTextClass"
-          :title="String(total)"
-        >
-          {{ centerText }}
-        </p>
-        <p class="mt-0.5 text-[10px] text-muted">
-          次
-        </p>
-      </div>
-    </div>
-
-    <ul class="min-w-0 flex-1 space-y-1.5">
-      <li
-        v-for="item in segments"
-        :key="item.label"
-        class="flex items-center gap-2 text-xs"
-      >
-        <span
-          class="size-2 shrink-0 rounded-full"
-          :style="{ background: item.color }"
-        />
-        <span class="min-w-0 flex-1 truncate">{{ item.label }}</span>
-        <span
-          class="shrink-0 tabular-nums text-muted"
-          :title="`${item.value}`"
-        >
-          {{ formatCount(item.value) }} ({{ percent(item.value) }}%)
-        </span>
-      </li>
-    </ul>
-  </div>
-</template>

app/composables/useImageList.ts

@@ -12,20 +12,13 @@ export function useImageList() {
   const totalPages = ref(1)
   const total = ref(0)
   const loading = ref(false)
-  const folderTotal = ref<number | null>(null)
+  const totalCount = ref<number | null>(null)
   const loadingTotal = ref(false)
   const searchQuery = ref('')
   const activeSearch = ref('')
-  const activeFolder = ref('all')
   const activeStorageBackend = ref('all')
   const storageBackendOptions = ref<Array<{ id: string, name: string }>>([])
 
-  function folderQueryParams(): Record<string, string> {
-    const folder = activeFolder.value.trim()
-    if (!folder || folder === 'all') return {}
-    return { folder }
-  }
-
   function storageQueryParams(): Record<string, string> {
     const backendId = activeStorageBackend.value.trim()
     if (!backendId || backendId === 'all') return {}
@@ -33,16 +26,7 @@ export function useImageList() {
   }
 
   function listQueryParams(): Record<string, string> {
-    return {
-      ...folderQueryParams(),
-      ...storageQueryParams()
-    }
-  }
-
-  function matchesActiveFolder(key: string) {
-    const folder = activeFolder.value.trim()
-    if (!folder || folder === 'all') return true
-    return key.startsWith(`${folder}/`)
+    return storageQueryParams()
   }
 
   function matchesActiveStorage(item: ImageItem) {
@@ -74,9 +58,9 @@ export function useImageList() {
         credentials: 'include',
         query: listQueryParams()
       })
-      folderTotal.value = data.total
+      totalCount.value = data.total
     } catch {
-      folderTotal.value = null
+      totalCount.value = null
     } finally {
       loadingTotal.value = false
     }
@@ -138,27 +122,13 @@ export function useImageList() {
     await Promise.all([fetchList(1), fetchTotal()])
   }
 
-  async function initializeList(folder = 'all') {
-    const next = folder.trim() || 'all'
-    activeFolder.value = next
+  async function initializeList() {
     page.value = 1
     activeSearch.value = ''
     searchQuery.value = ''
     await Promise.all([fetchList(1), fetchTotal(), loadStorageBackendOptions()])
   }
 
-  async function setActiveFolder(folder: string) {
-    const next = folder.trim() || 'all'
-    if (next === activeFolder.value) return
-    activeFolder.value = next
-    page.value = 1
-    if (activeSearch.value) {
-      await Promise.all([fetchSearch(1), fetchTotal()])
-    } else {
-      await Promise.all([fetchList(1), fetchTotal()])
-    }
-  }
-
   async function setActiveStorageBackend(backendId: string) {
     const next = backendId.trim() || 'all'
     if (next === activeStorageBackend.value) return
@@ -192,14 +162,12 @@ export function useImageList() {
   }
 
   function prependItems(newItems: ImageItem[]) {
-    const matched = newItems.filter(item =>
-      matchesActiveFolder(item.key) && matchesActiveStorage(item)
-    )
+    const matched = newItems.filter(item => matchesActiveStorage(item))
     if (!matched.length || page.value !== 1) return
     items.value = [...matched, ...items.value]
     total.value += matched.length
-    if (folderTotal.value !== null) {
-      folderTotal.value += matched.length
+    if (totalCount.value !== null) {
+      totalCount.value += matched.length
     }
   }
 
@@ -210,8 +178,8 @@ export function useImageList() {
     if (removed > 0) {
       total.value = Math.max(0, total.value - removed)
     }
-    if (folderTotal.value !== null && removed > 0) {
-      folderTotal.value = Math.max(0, folderTotal.value - removed)
+    if (totalCount.value !== null && removed > 0) {
+      totalCount.value = Math.max(0, totalCount.value - removed)
     }
   }
 
@@ -223,34 +191,30 @@ export function useImageList() {
   })
 
   const listSummary = computed(() => {
-    const folder = activeFolder.value.trim() || 'all'
-    const folderLabel = folder === 'all' ? t('stats.allFolders') : folder
     const storageLabel = activeStorageLabel.value
-    if (loadingTotal.value && folderTotal.value === null) {
+    if (loadingTotal.value && totalCount.value === null) {
       return storageLabel
-        ? `${folderLabel} · ${storageLabel} · ${t('stats.counting')}`
-        : `${folderLabel} · ${t('stats.counting')}`
+        ? `${storageLabel} · ${t('stats.counting')}`
+        : t('stats.counting')
     }
     if (activeSearch.value) {
       if (storageLabel) {
         return t('stats.summarySearchStorage', {
-          folder: folderLabel,
-          storage: storageLabel,
           q: activeSearch.value,
-          total: total.value
+          total: total.value,
+          storage: storageLabel
         })
       }
-      return t('stats.summarySearch', { folder: folderLabel, q: activeSearch.value, total: total.value })
+      return t('stats.summarySearch', { q: activeSearch.value, total: total.value })
     }
-    const count = folderTotal.value === null ? total.value : folderTotal.value
+    const count = totalCount.value === null ? total.value : totalCount.value
     if (storageLabel) {
       return t('stats.summaryTotalStorage', {
-        folder: folderLabel,
-        storage: storageLabel,
-        total: count
+        total: count,
+        storage: storageLabel
       })
     }
-    return t('stats.summaryTotal', { folder: folderLabel, total: count })
+    return t('stats.summaryTotal', { total: count })
   })
 
   return {
@@ -259,7 +223,6 @@ export function useImageList() {
     totalPages,
     total,
     loading,
-    activeFolder,
     activeStorageBackend,
     storageBackendOptions,
     searchQuery,
@@ -270,7 +233,6 @@ export function useImageList() {
     fetchTotal,
     refreshList,
     initializeList,
-    setActiveFolder,
     setActiveStorageBackend,
     loadStorageBackendOptions,
     submitSearch,

app/composables/useImageUpload.ts

@@ -17,8 +17,7 @@ export function useImageUpload() {
 
   async function uploadFiles(
     files: File[],
-    folder = 'images',
-    options?: { notify?: boolean, includeFolder?: boolean }
+    options?: { notify?: boolean }
   ) {
     if (uploading.value) return
 
@@ -55,9 +54,6 @@ export function useImageUpload() {
       }))
 
       const formData = new FormData()
-      if (options?.includeFolder !== false) {
-        formData.append('folder', folder.trim() || 'images')
-      }
       for (const file of prepared) {
         formData.append('files', file, file.name)
       }

app/composables/useUploadPreferences.ts

@@ -3,7 +3,6 @@ const STORAGE_KEY = 'pichost.upload-preferences'
 export type CopyFormat = 'url' | 'markdown' | 'html'
 
 export interface UploadPreferences {
-  defaultFolder: string
   compressEnabled: boolean
   autoCopyMarkdown: boolean
   copyFormat: CopyFormat
@@ -11,7 +10,6 @@ export interface UploadPreferences {
 }
 
 const DEFAULTS: UploadPreferences = {
-  defaultFolder: 'images',
   compressEnabled: false,
   autoCopyMarkdown: false,
   copyFormat: 'markdown',
@@ -36,9 +34,6 @@ function readStored(): UploadPreferences {
     if (!raw) return { ...DEFAULTS }
     const parsed = JSON.parse(raw) as Partial<UploadPreferences>
     return {
-      defaultFolder: typeof parsed.defaultFolder === 'string' && parsed.defaultFolder.trim()
-        ? parsed.defaultFolder.trim()
-        : DEFAULTS.defaultFolder,
       compressEnabled: parsed.compressEnabled === true,
       autoCopyMarkdown: parsed.autoCopyMarkdown === true,
       copyFormat: isCopyFormat(parsed.copyFormat) ? parsed.copyFormat : DEFAULTS.copyFormat,
@@ -55,7 +50,6 @@ function writeStored(prefs: UploadPreferences) {
 }
 
 export function useUploadPreferences() {
-  const defaultFolder = useState('upload-pref-folder', () => DEFAULTS.defaultFolder)
   const compressEnabled = useState('upload-pref-compress', () => DEFAULTS.compressEnabled)
   const autoCopyMarkdown = useState('upload-pref-auto-md', () => DEFAULTS.autoCopyMarkdown)
   const copyFormat = useState<CopyFormat>('upload-pref-copy-format', () => DEFAULTS.copyFormat)
@@ -64,7 +58,6 @@ export function useUploadPreferences() {
 
   function loadPreferences() {
     const stored = readStored()
-    defaultFolder.value = stored.defaultFolder
     compressEnabled.value = stored.compressEnabled
     autoCopyMarkdown.value = stored.autoCopyMarkdown
     copyFormat.value = stored.copyFormat
@@ -74,7 +67,6 @@ export function useUploadPreferences() {
 
   function savePreferences() {
     writeStored({
-      defaultFolder: defaultFolder.value.trim() || DEFAULTS.defaultFolder,
       compressEnabled: compressEnabled.value,
       autoCopyMarkdown: autoCopyMarkdown.value,
       copyFormat: copyFormat.value,
@@ -82,14 +74,13 @@ export function useUploadPreferences() {
     })
   }
 
-  watch([defaultFolder, compressEnabled, autoCopyMarkdown, copyFormat, clientWebpQuality], () => {
+  watch([compressEnabled, autoCopyMarkdown, copyFormat, clientWebpQuality], () => {
     if (loaded.value) {
       savePreferences()
     }
   })
 
   return {
-    defaultFolder,
     compressEnabled,
     autoCopyMarkdown,
     copyFormat,

app/pages/api.vue

@@ -52,34 +52,13 @@ const authHeader = computed(() =>
 const authHeaderFlag = computed(() => `-H 'Auth-Token: ${authHeader.value}'`)
 
 const apiDocs = computed<ApiDocItem[]>(() => {
-  const uploadDescription = isAdmin.value
-    ? t('api.docs.upload.descAdmin')
-    : t('api.docs.upload.descUser')
-  const uploadCurl = isAdmin.value
-    ? `curl -X POST "${baseUrl.value}/api/images/upload" \\
-  ${authHeaderFlag.value} \\
-  -F "image=@./demo.png"
-
-${t('api.docs.upload.curlCustomFolder')}
-curl -X POST "${baseUrl.value}/api/images/upload" \\
-  ${authHeaderFlag.value} \\
-  -F "folder=blog" \\
-  -F "image=@./demo.png"`
-    : `curl -X POST "${baseUrl.value}/api/images/upload" \\
+  const uploadDescription = t('api.docs.upload.desc')
+  const uploadCurl = `curl -X POST "${baseUrl.value}/api/images/upload" \\
   ${authHeaderFlag.value} \\
   -F "image=@./demo.png"`
 
-  const listDescription = isAdmin.value
-    ? t('api.docs.list.descAdmin')
-    : t('api.docs.list.descUser')
-  const listCurl = isAdmin.value
-    ? `curl "${baseUrl.value}/api/images?limit=20&page=1" \\
-  ${authHeaderFlag.value}
-
-${t('api.docs.list.curlFolderFilter')}
-curl "${baseUrl.value}/api/images?folder=blog&limit=20&page=1" \\
-  ${authHeaderFlag.value}`
-    : `curl "${baseUrl.value}/api/images?limit=20&page=1" \\
+  const listDescription = t('api.docs.list.desc')
+  const listCurl = `curl "${baseUrl.value}/api/images?limit=20&page=1" \\
   ${authHeaderFlag.value}`
 
   return [
@@ -156,10 +135,12 @@ function methodBadgeColor(method: ApiDocItem['method']) {
   switch (method) {
     case 'GET':
       return 'info' as const
+    case 'POST':
+      return 'warning' as const
     case 'DELETE':
       return 'error' as const
     default:
-      return 'primary' as const
+      return 'neutral' as const
   }
 }
 
@@ -219,15 +200,6 @@ async function confirmRegenerate() {
   }
 }
 
-async function copyCurl(text: string) {
-  try {
-    await navigator.clipboard.writeText(text)
-    toast.add({ title: t('copy.curl'), color: 'success' })
-  } catch {
-    toast.add({ title: t('copy.failed'), color: 'error' })
-  }
-}
-
 function closeConfirmRegenerate() {
   confirmRegenerateOpen.value = false
 }
@@ -404,18 +376,7 @@ watch(isAuthenticated, async (authed, prev) => {
               <p class="mb-2 text-xs font-medium text-muted">
                 {{ t('api.curlExample') }}
               </p>
-              <div class="relative overflow-hidden rounded-xl bg-neutral-950">
-                <UButton
-                  icon="i-lucide-copy"
-                  :label="t('common.copy')"
-                  size="xs"
-                  variant="ghost"
-                  color="neutral"
-                  class="absolute top-2 right-2 z-10 text-neutral-300 hover:text-white"
-                  @click="copyCurl(doc.curl)"
-                />
-                <pre class="max-h-80 overflow-auto p-4 pt-10 text-xs leading-relaxed text-neutral-100"><code class="font-mono">{{ doc.curl }}</code></pre>
-              </div>
+              <ApiCurlBlock :code="doc.curl" />
             </div>
           </article>
         </div>
@@ -431,7 +392,7 @@ watch(isAuthenticated, async (authed, prev) => {
             <div class="min-w-0 space-y-2">
               <div class="flex flex-wrap items-center gap-2">
                 <UBadge
-                  color="neutral"
+                  :color="methodBadgeColor(twikooDoc.method)"
                   variant="subtle"
                   size="sm"
                 >
@@ -454,18 +415,10 @@ watch(isAuthenticated, async (authed, prev) => {
             <p class="mb-2 text-xs font-medium text-muted">
               {{ t('api.curlExample') }}
             </p>
-            <div class="relative overflow-hidden rounded-xl bg-neutral-950">
-              <UButton
-                icon="i-lucide-copy"
-                :label="t('common.copy')"
-                size="xs"
-                variant="ghost"
-                color="neutral"
-                class="absolute top-2 right-2 z-10 text-neutral-300 hover:text-white"
-                @click="copyCurl(twikooDoc.curl)"
-              />
-              <pre class="overflow-auto p-4 pt-10 text-xs leading-relaxed text-neutral-100"><code class="font-mono">{{ twikooDoc.curl }}</code></pre>
-            </div>
+            <ApiCurlBlock
+              :code="twikooDoc.curl"
+              :scrollable="false"
+            />
           </div>
         </div>
       </section>

app/pages/index.vue

@@ -4,17 +4,14 @@ import type { ImageItem } from '~/types/image'
 const { uploading, progressItems, uploadFiles } = useImageUpload()
 
 const {
-  defaultFolder,
   autoCopyMarkdown,
   copyFormat,
   loadPreferences
 } = useUploadPreferences()
 
-const { isChecking, isAuthenticated, checkSession, handleAuthError, fetchStatus, isAdmin }
-  = useAuth()
+const { isChecking, isAuthenticated, checkSession, handleAuthError, fetchStatus } = useAuth()
 const toast = useToast()
 const { t } = useI18n()
-const folderOptions = ref<string[]>(['images'])
 const sessionItems = ref<ImageItem[]>([])
 const deletingKeys = ref<Set<string>>(new Set())
 const emptySelection = ref(new Set<string>())
@@ -30,22 +27,9 @@ const showProgress = computed(
     )
 )
 
-async function loadFolders() {
-  const data = await $fetch<{ folders: string[] }>('/api/folders', {
-    credentials: 'include'
-  })
-  folderOptions.value = [...data.folders]
-  if (!folderOptions.value.includes(defaultFolder.value)) {
-    defaultFolder.value = folderOptions.value[0] ?? 'images'
-  }
-}
-
 async function loadPage() {
   try {
     loadPreferences()
-    if (isAdmin.value) {
-      await loadFolders()
-    }
   } catch (error: unknown) {
     handleAuthError(error)
   }
@@ -112,20 +96,9 @@ async function handleUpload(files: File[]) {
   }
 
   try {
-    const uploadTarget = isAdmin.value
-      ? (defaultFolder.value.trim() || 'images')
-      : 'images'
-    const result = await uploadFiles(files, uploadTarget, {
-      includeFolder: isAdmin.value
-    })
+    const result = await uploadFiles(files)
     if (result?.items.length) {
       sessionItems.value = [...result.items, ...sessionItems.value]
-      if (isAdmin.value) {
-        const folder = uploadTarget
-        if (!folderOptions.value.includes(folder)) {
-          folderOptions.value = [...folderOptions.value, folder]
-        }
-      }
       if (autoCopyMarkdown.value && result.items[0]) {
         const first = result.items[0]
         const text

app/pages/logs.vue

@@ -38,8 +38,7 @@ const actionItems = computed(() => [
 const sourceItems = computed(() => [
   { label: t('logs.filterSourceAll'), value: 'all' as const },
   { label: t('logs.sourceWeb'), value: 'web' as const },
-  { label: t('logs.sourceApi'), value: 'api' as const },
-  { label: t('logs.sourceTwikoo'), value: 'twikoo' as const }
+  { label: t('logs.sourceApi'), value: 'api' as const }
 ])
 
 const userItems = computed(() => {
@@ -93,8 +92,6 @@ function sourceLabel(source: LogSource) {
       return t('logs.sourceWeb')
     case 'api':
       return t('logs.sourceApi')
-    case 'twikoo':
-      return t('logs.sourceTwikoo')
   }
 }
 

app/pages/settings/index.vue

@@ -27,12 +27,10 @@ interface SettingsResponse {
 }
 
 const { isChecking, isAuthenticated, checkSession, handleAuthError, fetchStatus, isAdmin } = useAuth()
-const { defaultFolder, loadPreferences } = useUploadPreferences()
 const toast = useToast()
 const { t } = useI18n()
 
 const settings = ref<SettingsResponse | null>(null)
-const folderOptions = ref<string[]>(['images'])
 const savingServer = ref(false)
 
 const refererDraft = ref('')
@@ -42,7 +40,6 @@ const hideFolderInUrlDraft = ref(false)
 const storageUseDatePathDraft = ref(true)
 const allowRegistrationDraft = ref(false)
 const domainSeparationDraft = ref(false)
-const hideFolderConfirmOpen = ref(false)
 
 interface ReleaseCheckResponse {
   currentVersion: string
@@ -53,10 +50,6 @@ interface ReleaseCheckResponse {
 
 const releaseCheck = ref<ReleaseCheckResponse | null>(null)
 
-const folderSelectItems = computed(() =>
-  folderOptions.value.map(folder => ({ label: folder, value: folder }))
-)
-
 const hasServerChanges = computed(() => {
   if (!settings.value) return false
   return refererDraft.value !== settings.value.allowedRefererHosts
@@ -131,28 +124,6 @@ function handlePatchError(error: unknown, fallback: string) {
   toast.add({ title: fallback, color: 'error' })
 }
 
-function onHideFolderDraftChange(next: boolean | 'indeterminate') {
-  if (next !== true) {
-    hideFolderInUrlDraft.value = false
-    return
-  }
-  if (folderOptions.value.length > 1) {
-    hideFolderConfirmOpen.value = true
-    return
-  }
-  hideFolderInUrlDraft.value = true
-}
-
-function confirmHideFolderEnable() {
-  hideFolderInUrlDraft.value = true
-  hideFolderConfirmOpen.value = false
-}
-
-function cancelHideFolderEnable() {
-  hideFolderInUrlDraft.value = false
-  hideFolderConfirmOpen.value = false
-}
-
 function onDomainSeparationDraftChange(next: boolean | 'indeterminate') {
   const enabled = next === true
   domainSeparationDraft.value = enabled
@@ -186,16 +157,6 @@ async function saveServerSettings() {
   }
 }
 
-async function loadFolders() {
-  const data = await $fetch<{ folders: string[] }>('/api/folders', {
-    credentials: 'include'
-  })
-  folderOptions.value = [...data.folders]
-  if (!folderOptions.value.includes(defaultFolder.value)) {
-    defaultFolder.value = folderOptions.value[0] ?? 'images'
-  }
-}
-
 async function loadSettings() {
   try {
     const data = await $fetch<SettingsResponse>('/api/settings', {
@@ -225,8 +186,7 @@ async function loadPage() {
     await navigateTo('/')
     return
   }
-  loadPreferences()
-  await Promise.all([loadSettings(), loadFolders(), checkLatestRelease()])
+  await Promise.all([loadSettings(), checkLatestRelease()])
 }
 
 onMounted(async () => {
@@ -354,7 +314,7 @@ watch(isAuthenticated, async (authed, prev) => {
                     :model-value="hideFolderInUrlDraft"
                     class="mt-0.5 shrink-0"
                     :disabled="settings.hideFolderInUrlSource === 'env'"
-                    @update:model-value="onHideFolderDraftChange"
+                    @update:model-value="(v) => hideFolderInUrlDraft = v === true"
                   />
                   <span class="min-w-0">
                     <span class="flex flex-wrap items-center gap-2 text-sm font-medium">
@@ -375,50 +335,11 @@ watch(isAuthenticated, async (authed, prev) => {
                 </label>
               </div>
 
-              <div class="settings-side-panel flex h-full min-w-0 flex-col rounded-xl border border-default/60 bg-muted/10 p-4 sm:p-5">
-                <div class="shrink-0 space-y-1.5">
-                  <label class="text-sm font-medium">{{ t('settings.defaultFolder') }}</label>
-                  <p class="text-xs leading-relaxed text-muted">
-                    {{ t('settings.defaultFolderHint') }}
-                  </p>
-                  <USelect
-                    v-model="defaultFolder"
-                    :items="folderSelectItems"
-                    class="settings-folder-select w-40 max-w-full"
-                  />
-                </div>
+              <div class="flex h-full min-w-0 flex-col space-y-4 rounded-xl border border-default/60 bg-muted/10 p-4 sm:p-5">
+                <h3 class="text-sm font-semibold">
+                  {{ t('settings.domainSettings') }}
+                </h3>
 
-                <div class="settings-referer-section mt-4 space-y-1.5 border-t border-default/60 pt-4">
-                  <div class="flex flex-wrap items-center gap-2">
-                    <label class="text-sm font-medium">{{ t('settings.accessControl') }}</label>
-                    <UBadge
-                      :color="sourceBadge(settings.refererSource).color"
-                      variant="subtle"
-                      size="xs"
-                    >
-                      {{ sourceBadge(settings.refererSource).label }}
-                    </UBadge>
-                  </div>
-                  <p class="text-xs leading-relaxed text-muted">
-                    {{ t('settings.refererHint') }}
-                  </p>
-                  <UTextarea
-                    v-model="refererDraft"
-                    :placeholder="t('settings.refererPlaceholder')"
-                    :rows="4"
-                    :autoresize="false"
-                    class="settings-referer-field flex min-h-0 w-full max-w-xl flex-1 flex-col font-mono text-sm"
-                  />
-                </div>
-              </div>
-            </div>
-
-            <div class="rounded-xl border border-default/60 bg-muted/10 p-4 sm:p-5">
-              <h3 class="text-sm font-semibold">
-                {{ t('settings.domainSettings') }}
-              </h3>
-
-              <div class="mt-4 space-y-4">
                 <label class="flex cursor-pointer items-start gap-2.5 rounded-lg border border-default/50 bg-default/40 p-3">
                   <UCheckbox
                     :model-value="domainSeparationDraft"
@@ -469,7 +390,7 @@ watch(isAuthenticated, async (authed, prev) => {
                     <UInput
                       v-model="siteBaseUrlDraft"
                       :placeholder="t('settings.siteBaseUrlPlaceholder')"
-                      class="w-full max-w-xl font-mono text-sm"
+                      class="w-full font-mono text-sm"
                     />
                     <p
                       v-if="settings.siteBaseUrl"
@@ -497,7 +418,7 @@ watch(isAuthenticated, async (authed, prev) => {
                     <UInput
                       v-model="imageBaseUrlDraft"
                       :placeholder="t('settings.imageBaseUrlPlaceholder')"
-                      class="w-full max-w-xl font-mono text-sm"
+                      class="w-full font-mono text-sm"
                     />
                     <p
                       v-if="settings.imageBaseUrl"
@@ -529,7 +450,7 @@ watch(isAuthenticated, async (authed, prev) => {
                   <UInput
                     v-model="imageBaseUrlDraft"
                     :placeholder="t('settings.imageBaseUrlPlaceholder')"
-                    class="w-full max-w-xl font-mono text-sm"
+                    class="w-full font-mono text-sm"
                   />
                   <p
                     v-if="settings.imageBaseUrl"
@@ -541,6 +462,31 @@ watch(isAuthenticated, async (authed, prev) => {
                 </div>
               </div>
             </div>
+
+            <div class="settings-referer-section space-y-1.5 rounded-xl border border-default/60 bg-muted/10 p-4 sm:p-5">
+              <div class="flex flex-wrap items-center gap-2">
+                <h3 class="text-sm font-semibold">
+                  {{ t('settings.accessControl') }}
+                </h3>
+                <UBadge
+                  :color="sourceBadge(settings.refererSource).color"
+                  variant="subtle"
+                  size="xs"
+                >
+                  {{ sourceBadge(settings.refererSource).label }}
+                </UBadge>
+              </div>
+              <p class="text-xs leading-relaxed text-muted">
+                {{ t('settings.refererHint') }}
+              </p>
+              <UTextarea
+                v-model="refererDraft"
+                :placeholder="t('settings.refererPlaceholder')"
+                :rows="4"
+                :autoresize="false"
+                class="settings-referer-field w-full font-mono text-sm"
+              />
+            </div>
           </div>
         </div>
 
@@ -618,57 +564,11 @@ watch(isAuthenticated, async (authed, prev) => {
         </div>
       </section>
     </AppShell>
-
-    <UModal
-      :open="hideFolderConfirmOpen"
-      :title="t('settings.hideFolderConfirmTitle')"
-      :description="t('settings.hideFolderConfirmDesc')"
-      @update:open="(open) => { if (!open) cancelHideFolderEnable() }"
-    >
-      <template #footer>
-        <div class="flex justify-end gap-2">
-          <UButton
-            :label="t('common.cancel')"
-            color="neutral"
-            variant="outline"
-            @click="cancelHideFolderEnable"
-          />
-          <UButton
-            :label="t('settings.hideFolderConfirmEnable')"
-            color="warning"
-            @click="confirmHideFolderEnable"
-          />
-        </div>
-      </template>
-    </UModal>
   </div>
 </template>
 
 <style scoped>
-.settings-side-panel {
-  overflow: hidden;
-}
-
-.settings-folder-select {
-  min-width: 0;
-}
-
-.settings-folder-select :deep(button),
-.settings-folder-select :deep([role='combobox']) {
-  justify-content: space-between;
-}
-
 .settings-referer-section {
-  display: flex;
-  flex: 1;
-  flex-direction: column;
-  min-height: 0;
-  min-width: 0;
-}
-
-.settings-referer-field {
-  flex: 1;
-  min-height: 0;
   min-width: 0;
 }
 
@@ -680,7 +580,6 @@ watch(isAuthenticated, async (authed, prev) => {
 }
 
 .settings-referer-field :deep(textarea) {
-  height: 100%;
   min-height: 5.5rem;
   resize: none;
 }

app/pages/stats.vue

@@ -12,17 +12,7 @@ interface StatsResponse {
   bySource: {
     web: number
     api: number
-    twikoo: number
   }
-  byFolder: Array<{
-    folder: string
-    count: number
-    bytes: number
-  }>
-  byFolderUploads: Array<{
-    folder: string
-    count: number
-  }>
 }
 
 const {
@@ -38,7 +28,6 @@ const {
   fetchList,
   fetchSearch,
   fetchTotal,
-  setActiveFolder,
   submitSearch,
   goToPage,
   removeItems,
@@ -63,14 +52,7 @@ const deleteModalOpen = ref(false)
 const deleteTargetKeys = ref<string[]>([])
 const batchDeleting = ref(false)
 const showScrollTop = ref(false)
-const currentFolder = ref('all')
 const currentStorage = ref('all')
-const folderOptions = ref<string[]>(['images'])
-
-const folderSelectItems = computed(() => [
-  { label: t('stats.allFolders'), value: 'all' },
-  ...folderOptions.value.map(folder => ({ label: folder, value: folder }))
-])
 
 const storageSelectItems = computed(() => [
   { label: t('stats.filterStorageAll'), value: 'all' },
@@ -82,41 +64,29 @@ const storageSelectItems = computed(() => [
 
 const selectedCount = computed(() => selectedKeys.value.size)
 
-const FOLDER_CHART_COLORS = [
+const SOURCE_CHART_COLORS = [
   'var(--ui-primary)',
-  '#10b981',
-  '#f59e0b',
-  '#8b5cf6',
-  '#ec4899',
-  '#06b6d4'
+  '#10b981'
 ]
 
-const folderUploadItems = computed(() =>
-  (stats.value?.byFolderUploads ?? []).map((item, index) => ({
-    key: item.folder,
-    label: item.folder,
-    count: item.count,
-    color: FOLDER_CHART_COLORS[index % FOLDER_CHART_COLORS.length]!
-  }))
+const sourceUploadItems = computed(() => {
+  const bySource = stats.value?.bySource
+  if (!bySource) return []
+  return [
+    { key: 'web', label: t('stats.sourceWeb'), count: bySource.web, color: SOURCE_CHART_COLORS[0]! },
+    { key: 'api', label: t('stats.sourceApi'), count: bySource.api, color: SOURCE_CHART_COLORS[1]! }
+  ]
+})
+
+const sourceUploadTotal = computed(() =>
+  sourceUploadItems.value.reduce((sum, item) => sum + item.count, 0)
 )
 
-const donutSegments = computed(() =>
-  folderUploadItems.value.map(item => ({
-    label: item.label,
-    value: item.count,
-    color: item.color
-  }))
-)
-
-const folderStats = computed(() => stats.value?.byFolder ?? [])
-
-const folderMaxBytes = computed(() =>
-  Math.max(...folderStats.value.map(item => item.bytes), 1)
-)
-
-const uploadChartTotal = computed(() =>
-  folderUploadItems.value.reduce((sum, item) => sum + item.count, 0)
-)
+function sourcePercent(count: number) {
+  const total = sourceUploadTotal.value
+  if (!total) return 0
+  return Math.round((count / total) * 100)
+}
 
 const statCards = computed(() => {
   const s = stats.value
@@ -143,17 +113,6 @@ function scrollToTop() {
   window.scrollTo({ top: 0, behavior: 'smooth' })
 }
 
-function folderPercent(bytes: number) {
-  return Math.round((bytes / folderMaxBytes.value) * 100)
-}
-
-async function loadFolders() {
-  const data = await $fetch<{ folders: string[] }>('/api/folders', {
-    credentials: 'include'
-  })
-  folderOptions.value = [...data.folders]
-}
-
 async function fetchStats() {
   stats.value = await $fetch<StatsResponse>('/api/stats', {
     credentials: 'include'
@@ -178,7 +137,7 @@ async function refreshGallery() {
   if (!isAuthenticated.value) return
   selectedKeys.value = new Set()
   try {
-    await Promise.all([refreshList(), loadFolders(), loadStorageBackendOptions()])
+    await Promise.all([refreshList(), loadStorageBackendOptions()])
     currentStorage.value = activeStorageBackend.value
   } catch (error: unknown) {
     handleAuthError(error)
@@ -202,7 +161,6 @@ async function refreshAll() {
     await Promise.all([
       fetchStats(),
       reloadGallery(),
-      loadFolders(),
       loadStorageBackendOptions()
     ])
     currentStorage.value = activeStorageBackend.value
@@ -216,17 +174,6 @@ async function refreshAll() {
   }
 }
 
-async function handleFolderChange(folder: string) {
-  if (!isAuthenticated.value) return
-  currentFolder.value = folder
-  selectedKeys.value = new Set()
-  try {
-    await setActiveFolder(folder)
-  } catch (error: unknown) {
-    handleAuthError(error)
-  }
-}
-
 async function handleStorageChange(backendId: string) {
   if (!isAuthenticated.value) return
   currentStorage.value = backendId
@@ -406,67 +353,60 @@ watch(isAuthenticated, async (authed, prev) => {
         />
       </div>
 
-      <section class="grid grid-cols-2 gap-3 lg:grid-cols-4">
-        <div
-          v-for="item in statCards"
-          :key="item.label"
-          class="rounded-xl border border-default bg-elevated p-4"
-        >
-          <p class="text-xs text-muted">
-            {{ item.label }}
-          </p>
-          <p class="mt-1 text-2xl font-semibold tabular-nums">
-            {{ item.value }}
-          </p>
-        </div>
-      </section>
-
-      <section class="grid gap-4 lg:grid-cols-2">
-        <div class="rounded-xl border border-default bg-elevated p-4">
-          <h2 class="mb-3 text-sm font-medium text-muted">
-            {{ t('stats.folderDistribution') }}
-          </h2>
+      <section class="grid gap-3 lg:grid-cols-3 lg:items-stretch">
+        <div class="grid grid-cols-2 gap-3 lg:col-span-2 lg:grid-cols-4">
           <div
-            v-if="!uploadChartTotal"
-            class="py-6 text-center text-xs text-muted"
+            v-for="item in statCards"
+            :key="item.label"
+            class="rounded-xl border border-default bg-elevated p-4"
           >
-            {{ t('stats.noData') }}
+            <p class="text-xs text-muted">
+              {{ item.label }}
+            </p>
+            <p class="mt-1 text-2xl font-semibold tabular-nums">
+              {{ item.value }}
+            </p>
           </div>
-          <StatsDonut
-            v-else
-            :segments="donutSegments"
-            :size="88"
-          />
         </div>
 
-        <div class="rounded-xl border border-default bg-elevated p-4">
-          <h2 class="mb-3 text-sm font-medium text-muted">
-            {{ t('stats.folderUsage') }}
+        <div class="flex h-full min-h-0 flex-col rounded-xl border border-default bg-elevated p-4 lg:col-span-1">
+          <h2 class="shrink-0 text-sm font-medium text-muted">
+            {{ t('stats.sourceDistribution') }}
           </h2>
           <div
-            v-if="!folderStats.length"
-            class="py-6 text-center text-xs text-muted"
+            v-if="!sourceUploadTotal"
+            class="flex flex-1 items-center justify-center text-center text-xs text-muted"
           >
             {{ t('stats.noData') }}
           </div>
           <ul
             v-else
-            class="space-y-2.5"
+            class="mt-4 flex min-h-0 flex-1 flex-col"
           >
             <li
-              v-for="item in folderStats"
-              :key="item.folder"
+              v-for="item in sourceUploadItems"
+              :key="item.key"
+              class="flex flex-1 flex-col justify-center gap-2 py-1"
             >
-              <div class="mb-1 flex items-center justify-between gap-2 text-xs">
-                <span class="font-medium">{{ item.folder }}</span>
-                <span class="tabular-nums text-muted">
-                  {{ t('stats.folderCount', { count: item.count, size: formatFileSize(item.bytes) }) }}
+              <div class="flex items-center justify-between gap-2 text-xs">
+                <span class="flex min-w-0 items-center gap-1.5">
+                  <span
+                    class="size-2 shrink-0 rounded-full"
+                    :style="{ background: item.color }"
+                  />
+                  <span class="truncate">{{ item.label }}</span>
+                </span>
+                <span class="shrink-0 tabular-nums text-muted">
+                  {{ item.count }} ({{ sourcePercent(item.count) }}%)
                 </span>
               </div>
-              <div class="h-1.5 overflow-hidden rounded-full bg-muted/50">
+              <div class="h-2 rounded-full bg-muted/40">
                 <div
-                  class="h-full rounded-full bg-primary/70"
-                  :style="{ width: `${Math.max(folderPercent(item.bytes), item.bytes ? 4 : 0)}%` }"
+                  class="h-full rounded-full transition-[width]"
+                  :style="{
+                    width: `${sourcePercent(item.count)}%`,
+                    backgroundColor: item.color
+                  }"
                 />
               </div>
             </li>
@@ -500,14 +440,6 @@ watch(isAuthenticated, async (authed, prev) => {
             >
               {{ t('stats.selected', { n: selectedCount }) }}
             </UBadge>
-            <USelect
-              v-model="currentFolder"
-              :items="folderSelectItems"
-              class="w-[5.5rem] shrink-0 sm:w-32"
-              size="sm"
-              :aria-label="t('stats.folder')"
-              @update:model-value="handleFolderChange"
-            />
             <USelect
               v-model="currentStorage"
               :items="storageSelectItems"

app/types/logs.ts

@@ -1,15 +1,10 @@
 export type LogAction = 'upload' | 'delete'
-export type LogSource = 'web' | 'api' | 'twikoo'
-
-export interface ActivityLogUser {
-  id: number
-  username: string
-}
+export type LogSource = 'web' | 'api'
 
 export interface ActivityLogStorage {
   id: string
   name: string
-  type: 'local' | 's3'
+  type: string
 }
 
 export interface ActivityLogItem {
@@ -26,18 +21,16 @@ export interface ActivityLogItem {
   createdAt: string
 }
 
-export interface ActivityLogSummary {
-  total: number
-  upload: number
-  delete: number
-}
-
 export interface ActivityLogListResponse {
   items: ActivityLogItem[]
   total: number
   page: number
   pageSize: number
   totalPages: number
-  summary: ActivityLogSummary
-  users?: ActivityLogUser[]
+  summary: {
+    total: number
+    upload: number
+    delete: number
+  }
+  users?: Array<{ id: number, username: string }>
 }