>((
c
{{ $t('shortcuts.compare_from_package') }}
+
+ -
+ {{ $t('shortcuts.changelog') }}
+
diff --git a/app/components/Code/DirectoryListing.vue b/app/components/Code/DirectoryListing.vue
index cae0f3635e..ea47dd1adb 100644
--- a/app/components/Code/DirectoryListing.vue
+++ b/app/components/Code/DirectoryListing.vue
@@ -2,6 +2,7 @@
import type { RouteLocationRaw } from 'vue-router'
import type { RouteNamedMap } from 'vue-router/auto-routes'
import { ADDITIONAL_ICONS, getFileIcon } from '~/utils/file-icons'
+import { isPossiblyUnnecessaryContent } from '~/utils/package-content-hints'
const props = defineProps<{
tree: PackageFileTree[]
@@ -10,6 +11,8 @@ const props = defineProps<{
baseRoute: Pick
}>()
+const { t } = useI18n()
+
// Get the current directory's contents
const currentContents = computed(() => {
if (!props.currentPath) {
@@ -103,6 +106,11 @@ const bytesFormatter = useBytesFormatter()
@@ -117,7 +125,21 @@ const bytesFormatter = useBytesFormatter()
/>
- {{ node.name }}
+ {{ node.name }}
+
{{ bytesFormatter.format(node.size) }}
diff --git a/app/components/Code/FileTree.vue b/app/components/Code/FileTree.vue
index d3d20d6487..b2bcbf20e6 100644
--- a/app/components/Code/FileTree.vue
+++ b/app/components/Code/FileTree.vue
@@ -2,6 +2,7 @@
import type { RouteLocationRaw } from 'vue-router'
import type { RouteNamedMap } from 'vue-router/auto-routes'
import { ADDITIONAL_ICONS, getFileIcon } from '~/utils/file-icons'
+import { isPossiblyUnnecessaryContent } from '~/utils/package-content-hints'
const props = defineProps<{
tree: PackageFileTree[]
@@ -12,6 +13,7 @@ const props = defineProps<{
}>()
const depth = computed(() => props.depth ?? 0)
+const treeRoot = useTemplateRef('treeRoot')
// Check if a node or any of its children is currently selected
function isNodeActive(node: PackageFileTree): boolean {
@@ -35,12 +37,18 @@ function getFileRoute(nodePath: string): RouteLocationRaw {
const { toggleDir, isExpanded, autoExpandAncestors } = useFileTreeState(props.baseUrl)
+const scrollIntoView = () => {
+ const el = treeRoot.value?.querySelector('[aria-current="true"]')
+ el?.scrollIntoView({ block: 'center', behavior: 'smooth' })
+}
+
// Auto-expand directories in the current path
watch(
() => props.currentPath,
path => {
if (depth.value === 0 && path) {
autoExpandAncestors(path)
+ nextTick(scrollIntoView)
}
},
{ immediate: true },
@@ -48,7 +56,7 @@ watch(
-
+
-
@@ -56,6 +64,11 @@ watch(
class="w-full justify-start! rounded-none! border-none! transition-[color,background-color]! duration-100!"
block
:aria-pressed="isNodeActive(node)"
+ :aria-label="
+ isPossiblyUnnecessaryContent(node.name, 'directory')
+ ? `${node.name} - ${$t('code.possibly_unnecessary')}`
+ : undefined
+ "
:style="{ paddingLeft: `${depth * 12 + 12}px` }"
@click="toggleDir(node.path)"
:classicon="isExpanded(node.path) ? 'i-lucide:chevron-down' : 'i-lucide:chevron-right'"
@@ -70,7 +83,21 @@ watch(
:href="`/file-tree-sprite.svg#${isExpanded(node.path) ? ADDITIONAL_ICONS['folder-open'] : ADDITIONAL_ICONS['folder']}`"
/>
- {{ node.name }}
+ {{ node.name }}
+
- {{ node.name }}
+ {{ node.name }}
+
diff --git a/app/components/Code/Header.vue b/app/components/Code/Header.vue
index 40931151bd..6a3c04dbe3 100644
--- a/app/components/Code/Header.vue
+++ b/app/components/Code/Header.vue
@@ -211,7 +211,7 @@ useEventListener('keydown', (event: KeyboardEvent) => {
v-for="mode in markdownViewModes"
:key="mode.key"
role="tab"
- class="px-2 py-1.5 font-mono text-xs rounded transition-colors duration-150 inline-flex items-center gap-1.5"
+ class="cursor-pointer px-2 py-1.5 font-mono text-xs rounded transition-colors duration-150 inline-flex items-center gap-1.5"
:class="
markdownViewMode === mode.key
? 'bg-bg-muted shadow text-fg'
diff --git a/app/components/CollapsibleSection.vue b/app/components/CollapsibleSection.vue
index b107d4c889..c267d6a80b 100644
--- a/app/components/CollapsibleSection.vue
+++ b/app/components/CollapsibleSection.vue
@@ -95,7 +95,7 @@ useHead({
|