Add manual release date editor (#262)

* add manual release date editor

* watch() releaseDate instead of relying on coreMetadata updates

* make linter happy

---------

Co-authored-by: udifogiel <udifogiel@proton.me>

components/GameEditor/Metadata.vue

@@ -29,6 +29,23 @@
 
         <div class="grid grid-cols-1 lg:grid-cols-3 gap-4 pt-8">
           <MultiItemSelector v-model="currentTags" :items="tags" />
+          <div class="flex flex-col">
+            <label
+              for="releaseDate"
+              class="text-sm/6 font-medium text-zinc-100"
+            >
+              {{ $t("library.admin.game.editReleaseDate") }}
+            </label>
+            <div class="mt-2">
+              <input
+                id="releaseDate"
+                v-model="releaseDate"
+                type="date"
+                name="releaseDate"
+                class="block w-full rounded-md bg-zinc-800 px-3 py-1.5 text-base text-zinc-100 outline outline-1 -outline-offset-1 outline-zinc-700 placeholder:text-zinc-400 focus:outline focus:outline-2 focus:-outline-offset-2 focus:outline-blue-600 sm:text-sm/6"
+              />
+            </div>
+          </div>
         </div>
 
         <!-- image carousel pick -->
@@ -491,11 +508,38 @@ watch(
   { deep: true },
 );
 
+const releaseDate = ref(
+  game.value.mReleased
+    ? new Date(game.value.mReleased).toISOString().substring(0, 10)
+    : "",
+);
+
+watch(releaseDate, async (newDate) => {
+  const body: PatchGameBody = {};
+
+  if (newDate) {
+    const parsed = new Date(newDate);
+    if (!isNaN(parsed.getTime())) {
+      body.mReleased = parsed;
+    }
+  }
+
+  await $dropFetch(`/api/v1/admin/game/:id`, {
+    method: "PATCH",
+    params: {
+      id: game.value.id,
+    },
+    body,
+    failTitle: "Failed to update release date",
+  });
+});
+
 const { t } = useI18n();
 
 // I don't know why I split these fields off.
 const coreMetadataName = ref(game.value.mName);
 const coreMetadataDescription = ref(game.value.mShortDescription);
+
 const coreMetadataIconUrl = ref(useObject(game.value.mIconObjectId));
 const coreMetadataIconFileUpload = ref<FileList | undefined>();
 const coreMetadataLoading = ref(false);

i18n/locales/en_us.json

@@ -292,6 +292,7 @@
         "deleteImage": "Delete image",
         "editGameDescription": "Game Description",
         "editGameName": "Game Name",
+        "editReleaseDate": "Release Date",
         "imageCarousel": "Image Carousel",
         "imageCarouselDescription": "Customise what images and what order are shown on the store page.",
         "imageCarouselEmpty": "No images added to the carousel yet.",