From: Michael Tremer <michael.tremer@ipfire.org>
Date: Tue, 8 Jul 2025 09:45:01 +0000 (+0000)
Subject: frontend: Add control element to view files
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=6ae904c89d920891471d1ccac890dcef7e74e78d;p=pbs.git

frontend: Add control element to view files

Signed-off-by: Michael Tremer <michael.tremer@ipfire.org>
---

diff --git a/frontend/src/components/PackageFilelist.vue b/frontend/src/components/PackageFilelist.vue
index 6893ec26..963a8e34 100644
--- a/frontend/src/components/PackageFilelist.vue
+++ b/frontend/src/components/PackageFilelist.vue
@@ -12,7 +12,7 @@
 	import Section from "@/components/Section.vue";
 
 	// Utils
-	import { fileIsDownloadable } from "@/utils/files";
+	import { fileIsDownloadable, fileIsViewable } from "@/utils/files";
 	import { formatMode, formatSize } from "@/utils/format";
 
 	// Fetch the package
@@ -96,9 +96,13 @@
 					</td>
 
 					<!-- Actions -->
-					<td class="is-narrow">
-						<div class="buttons are-small">
-							<a class="button is-dark" v-if="fileIsDownloadable(file)"
+					<td class="has-text-right">
+						<div class="buttons are-small is-justify-content-end">
+							<a class="button" v-if="fileIsViewable(file)" href="#">
+								<Icon icon="magnifying-glass" :title="$t('View')" />
+							</a>
+
+							<a class="button" v-if="fileIsDownloadable(file)"
 									download :href="`/packages/${pkg.uuid}/download${file.path}`">
 								<Icon icon="download" :title="$t('Download')" />
 							</a>
diff --git a/frontend/src/utils/files.ts b/frontend/src/utils/files.ts
index c90c6fca..5ec03861 100644
--- a/frontend/src/utils/files.ts
+++ b/frontend/src/utils/files.ts
@@ -9,3 +9,59 @@ export function fileIsDownloadable(file: File): Boolean {
 
 	return (file.mode & S_IFMT) === S_IFREG;
 }
+
+export function fileIsViewable(file: File): Boolean {
+	// The file must be downloadable, too
+	if (!fileIsDownloadable(file))
+		return false;
+
+	// The file cannot be empty
+	if (file.size === 0)
+		return false;
+
+	// Any kind of text file is viewable
+	if (file.mimetype && file.mimetype.startsWith("text/"))
+		return true;
+
+	// A list of viewable extensions
+	const extensions = [
+		".c",
+		".cc",
+		".cfg",
+		".conf",
+		".config",
+		".cpp",
+		".diff",
+		".h",
+		".nm",
+		".patch",
+		".patch0",
+		".patch1",
+		".patch2",
+		".patch3",
+		".patch4",
+		".patch5",
+		".patch6",
+		".patch7",
+		".patch8",
+		".patch9",
+		".pl",
+		".pm",
+		".py",
+		".S",
+		".s",
+		".sh",
+		".txt",
+		"Kconfig",
+		"Makefile",
+	];
+
+	// Match any extensions
+	for (const extension of extensions) {
+		if (file.path.endsWith(extension))
+			return true;
+	}
+
+	// The file is now viewable
+	return false;
+}