From f68ff92f12f8ad4bc4f157b78771d16067eaaf97 Mon Sep 17 00:00:00 2001
From: Daniel Andreas Wang <codingforpeace@protonmail.com>
Date: Fri, 13 Mar 2026 17:38:13 +0100
Subject: add clock

---
 src/views/HomeView.vue | 28 ++++++++++++++++++++++++++--
 1 file changed, 26 insertions(+), 2 deletions(-)

(limited to 'src/views')

diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue
index a5290ec..c780410 100644
--- a/src/views/HomeView.vue
+++ b/src/views/HomeView.vue
@@ -1,15 +1,39 @@
 <script setup lang="ts">
-import { onMounted } from 'vue'
+import { ref, onMounted, onUnmounted } from 'vue'
+import dayjs from 'dayjs'
+import utc from 'dayjs/plugin/utc'
+import timezone from 'dayjs/plugin/timezone'
 import { useNewsStore } from '@/stores/news'
 
+dayjs.extend(utc)
+dayjs.extend(timezone)
+
+const tehranTime = ref('')
 const store = useNewsStore()
+let interval: ReturnType<typeof setInterval>
+
+const updateClocks = () => {
+  tehranTime.value = dayjs().tz('Asia/Tehran').format('HH:mm:ss')
+}
 
 onMounted(() => {
-  store.fetchTopHeadlines({ country: 'us' })
+  updateClocks()
+  interval = setInterval(updateClocks, 1000)
+  store.fetchEverything({ q: 'iran' })
+})
+
+onUnmounted(() => {
+  clearInterval(interval)
 })
 </script>
 
 <template>
+  <div class="container">
+    <div class="clock">
+      <div class="time">Tehran time: {{ tehranTime }}</div>
+    </div>
+  </div>
+
   <main>
     <p v-if="store.loading">Loading...</p>
     <p v-else-if="store.error">{{ store.error }}</p>
-- 
cgit