From 9edc1a8f58660db9ca219d50b1a53b1cffa68588 Mon Sep 17 00:00:00 2001
From: Artemiy Solopov <a.solopov.001@gmail.com>
Date: Fri, 18 Sep 2026 19:55:23 +0300
Subject: [PATCH] Auction show loading

---
 src/components/auctions/Index.vue             |  6 ++--
 src/components/auctions/ShowDialog.vue        | 29 ++++++++++++++-----
 .../auctions/current_auction_store.js         |  8 ++---
 .../scripts/current_auction_store_history.js  |  4 +--
 4 files changed, 31 insertions(+), 16 deletions(-)

diff --git a/src/components/auctions/Index.vue b/src/components/auctions/Index.vue
index 5af5149..ee45063 100644
--- a/src/components/auctions/Index.vue
+++ b/src/components/auctions/Index.vue
@@ -3,7 +3,7 @@ import {ref, computed, onMounted, defineProps} from "vue";
 
 import {request} from "../lib/gateway.js";
 import {loadToken} from "../scripts/load_token.js";
-import {setAuction} from "./current_auction_store.js";
+import {setAuctionId} from "./current_auction_store.js";
 
 const pending = Symbol('pending')
 
@@ -40,8 +40,8 @@ const auctionPath = (id) => path + `?id=${id}`
 function navigateToAuction(auction) {
   let {id} = auction
   let path = auctionPath(id)
-  history.pushState({...auction}, null, path)
-  setAuction(auction)
+  history.pushState(id, null, path)
+  setAuctionId(id)
 }
 
 </script>
diff --git a/src/components/auctions/ShowDialog.vue b/src/components/auctions/ShowDialog.vue
index d577e7a..dd5fb5c 100644
--- a/src/components/auctions/ShowDialog.vue
+++ b/src/components/auctions/ShowDialog.vue
@@ -1,22 +1,37 @@
 <script setup>
-import {watch, useTemplateRef, onMounted, defineProps} from "vue";
+import {ref, watch, useTemplateRef, onMounted, defineProps} from "vue";
 import {useStore} from "@nanostores/vue";
 
-import {$currentAuction, resetAuction} from "./current_auction_store.js";
+import {request} from "../lib/gateway.js";
+import {loadToken} from "../scripts/load_token.js";
+import {$currentAuctionId, resetAuction} from "./current_auction_store.js";
 
-const currentAuction = useStore($currentAuction)
+const Loading = Symbol("loading")
+
+const currentAuctionId = useStore($currentAuctionId)
+const currentAuction = ref(Loading)
 const dialogRef = useTemplateRef('dialog')
 const {path} = defineProps(['path'])
 
 const showDialog = () => dialogRef.value.showModal()
 
+async function loadAuction() {
+  currentAuction.value = Loading
+  if(currentAuctionId.value == null) return
+
+  const res = await request(`/auctions/${currentAuctionId.value}`, {cors: true, token: loadToken().token})
+  currentAuction.value = await res.json()
+
+  showDialog()
+}
+
 onMounted(() => {
-  if(currentAuction.value !== null) showDialog()
+  if(currentAuctionId.value !== null) loadAuction()
 })
 
-watch(currentAuction,
+watch(currentAuctionId,
     (val, prevVal) => {
-      if (val !== null && prevVal == null) showDialog()
+      if (val !== null && prevVal == null) loadAuction()
       if (val == null) dialogRef.value.close()
     },
     {flush: 'post'})
@@ -24,7 +39,7 @@ watch(currentAuction,
 
 <template>
   <dialog ref="dialog" @close="resetAuction(path)">
-    <div class="card" v-if="currentAuction !== null">
+    <div class="card" v-if="currentAuctionId !== null && currentAuction !== Loading">
       <div class="card-body">
         <h2 class="h5">{{currentAuction.name}}</h2>
         <div class="buttons">
diff --git a/src/components/auctions/current_auction_store.js b/src/components/auctions/current_auction_store.js
index 09e7238..1671f2c 100644
--- a/src/components/auctions/current_auction_store.js
+++ b/src/components/auctions/current_auction_store.js
@@ -1,12 +1,12 @@
 import { atom } from "nanostores";
 
-export const $currentAuction = atom(null);
+export const $currentAuctionId = atom(null);
 
-export function setAuction(data) {
-    $currentAuction.set(data)
+export function setAuctionId(data) {
+    $currentAuctionId.set(data)
 }
 
 export function resetAuction(path) {
     history.pushState(null, null, path)
-    $currentAuction.set(null)
+    $currentAuctionId.set(null)
 }
\ No newline at end of file
diff --git a/src/components/auctions/scripts/current_auction_store_history.js b/src/components/auctions/scripts/current_auction_store_history.js
index 24ec074..03b4ca0 100644
--- a/src/components/auctions/scripts/current_auction_store_history.js
+++ b/src/components/auctions/scripts/current_auction_store_history.js
@@ -1,6 +1,6 @@
-import {setAuction} from "../current_auction_store.js";
+import {setAuctionId} from "../current_auction_store.js";
 
 window.addEventListener('popstate', (event) => {
     let {state} = event
-    setAuction(state)
+    setAuctionId(state)
 })
\ No newline at end of file