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 6893ec26b4bbdad27342d35852e1d22af157e2e5..963a8e34352bd762ac4ccbfc14ead962b5d0266a 100644 (file)
--- 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 c90c6fcae83dbcbf6230c552b2bb3c39fa11ebc5..5ec03861c103c148666aa58a4d0e1c2b44db8099 100644 (file)
--- 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;
+}