feat: use portainer hook instead of pushing image to gitea package repository

app/components/FilesTable.vue

@@ -0,0 +1,69 @@
+<script setup lang="ts">
+import type { TableColumn } from "@nuxt/ui";
+
+const UButton = resolveComponent("UButton");
+
+defineProps<{
+  data: FileEntry[];
+  status: "pending" | "idle" | "success" | "error";
+}>();
+
+const emit = defineEmits<{
+  rename: [file: FileEntry];
+  delete: [file: FileEntry];
+}>();
+
+const formatSize = (bytes: number): string => {
+  if (bytes < 1024) return `${bytes} B`;
+  if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)} KB`;
+  return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;
+};
+
+const formatDate = (iso: string): string =>
+  new Date(iso).toLocaleDateString(undefined, { dateStyle: "medium" });
+
+const columns: TableColumn<FileEntry>[] = [
+  { accessorKey: "name", header: "Name" },
+  {
+    accessorKey: "size",
+    header: "Size",
+    cell: ({ row }) => formatSize(row.original.size),
+  },
+  {
+    accessorKey: "modifiedAt",
+    header: "Modified",
+    cell: ({ row }) => formatDate(row.original.modifiedAt),
+  },
+  {
+    id: "actions",
+    cell: ({ row }) =>
+      h("div", { class: "flex justify-end gap-1" }, [
+        h(UButton, {
+          icon: "i-lucide-pencil",
+          variant: "ghost",
+          size: "sm",
+          onClick: () => emit("rename", row.original),
+        }),
+        h(UButton, {
+          icon: "i-lucide-trash-2",
+          variant: "ghost",
+          size: "sm",
+          color: "error",
+          onClick: () => emit("delete", row.original),
+        }),
+      ]),
+  },
+];
+</script>
+
+<template>
+  <UTable
+    :data="data"
+    :columns="columns"
+    :loading="status === 'pending' || status === 'idle'"
+  >
+    <template #empty>
+      {{ status === "pending" || status === "idle" ? "Loading..." : "No files" }}
+    </template>
+  </UTable>
+</template>

app/components/RenameFileModal.vue

@@ -0,0 +1,59 @@
+<script setup lang="ts">
+import { z } from "zod";
+import type { FormSubmitEvent } from "@nuxt/ui";
+
+const props = defineProps<{
+  filename: string;
+}>();
+
+const schema = z.object({
+  name: z
+    .string({ error: "Required" })
+    .min(1)
+    .regex(/^[^/\\]+$/, "Invalid filename"),
+});
+
+type Schema = z.output<typeof schema>;
+
+const emit = defineEmits<{ close: [value: boolean] }>();
+
+const toast = useToast();
+const submitting = ref(false);
+
+const state = reactive<Partial<Schema>>({
+  name: props.filename,
+});
+
+const onSubmit = async (event: FormSubmitEvent<Schema>) => {
+  submitting.value = true;
+  try {
+    await $fetch(`/api/files/${encodeURIComponent(props.filename)}`, {
+      method: "PATCH",
+      body: event.data,
+    });
+    toast.add({ title: "File renamed", color: "success" });
+    emit("close", true);
+  } catch (error) {
+    toast.add({ title: getApiError(error), color: "error" });
+  } finally {
+    submitting.value = false;
+  }
+};
+</script>
+
+<template>
+  <UModal title="Rename file">
+    <template #body>
+      <UForm :schema="schema" :state="state" class="space-y-4" @submit="onSubmit">
+        <UFormField label="Name" name="name">
+          <UInput v-model="state.name" class="w-full" />
+        </UFormField>
+
+        <div class="flex justify-end gap-2 pt-2">
+          <UButton variant="ghost" @click="emit('close', false)">Cancel</UButton>
+          <UButton type="submit" variant="subtle" :loading="submitting" icon="i-lucide-save">Save</UButton>
+        </div>
+      </UForm>
+    </template>
+  </UModal>
+</template>