autoselect most recent state on play

rommapp · Jul 8, 2024 · c448efd · c448efd
1 parent 51bc201
commit c448efd
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 15 deletions.
diff --git a/frontend/src/components/Details/Saves.vue b/frontend/src/components/Details/Saves.vue
@@ -27,7 +27,7 @@ const HEADERS = [
     key: "emulator",
   },
   {
-    title: "Last update",
+    title: "Updated",
     align: "start",
     sortable: true,
     key: "updated_at",

diff --git a/frontend/src/components/Details/States.vue b/frontend/src/components/Details/States.vue
@@ -28,7 +28,7 @@ const HEADERS = [
     key: "emulator",
   },
   {
-    title: "Last update",
+    title: "Updated",
     align: "start",
     sortable: true,
     key: "updated_at",

diff --git a/frontend/src/views/Play/Base.vue b/frontend/src/views/Play/Base.vue
@@ -9,10 +9,8 @@ import Player from "@/views/Play/Player.vue";
 import { isNull } from "lodash";
 import { onMounted, ref } from "vue";
 import { useRoute } from "vue-router";
-import { useTheme } from "vuetify";
 
 // Props
-const theme = useTheme();
 const route = useRoute();
 const rom = ref<DetailedRom | null>(null);
 const firmwareOptions = ref<FirmwareSchema[]>([]);
@@ -52,6 +50,12 @@ onMounted(async () => {
     platformId: romResponse.data.platform_id,
   });
   firmwareOptions.value = firmwareResponse.data;
+  // Auto select most recent state
+  if (rom.value.user_states && rom.value.user_states?.length > 0) {
+    stateRef.value = rom.value.user_states.sort((a, b) =>
+      b.updated_at.localeCompare(a.updated_at)
+    )[0];
+  }
 });
 </script>
 
@@ -206,17 +210,17 @@ onMounted(async () => {
             "
           >
             <template #selection="{ item }">
-              <v-list-item :title="item.value.file_name ?? ''">
+              <v-list-item class="pa-0" :title="item.value.file_name ?? ''">
                 <template #append>
                   <v-chip size="x-small" class="ml-1" color="orange" label>{{
                     item.value.emulator
                   }}</v-chip>
-                  <v-chip size="x-small" class="ml-1" label>
-                    {{ formatTimestamp(item.value.updated_at) }}
-                  </v-chip>
                   <v-chip size="x-small" class="ml-1" label
-                    >{{ formatBytes(item.value.file_size_bytes) }}
-                  </v-chip>
+                  >{{ formatBytes(item.value.file_size_bytes) }}
+                </v-chip>
+                <v-chip size="small" class="ml-1" label>
+                  {{ formatTimestamp(item.value.updated_at) }}
+                </v-chip>
                 </template>
               </v-list-item>
             </template>
@@ -230,12 +234,12 @@ onMounted(async () => {
                   <v-chip size="x-small" class="ml-1" color="orange" label>{{
                     item.value.emulator
                   }}</v-chip>
-                  <v-chip size="x-small" class="ml-1" label>
-                    {{ formatTimestamp(item.value.updated_at) }}
-                  </v-chip>
                   <v-chip size="x-small" class="ml-1" label
-                    >{{ formatBytes(item.value.file_size_bytes) }}
-                  </v-chip>
+                  >{{ formatBytes(item.value.file_size_bytes) }}
+                </v-chip>
+                <v-chip size="small" class="ml-1" label>
+                  {{ formatTimestamp(item.value.updated_at) }}
+                </v-chip>
                 </template>
               </v-list-item>
             </template>