diff --git a/frontend/app.vue b/frontend/app.vue
index 8f275a0..7c4c63c 100644
--- a/frontend/app.vue
+++ b/frontend/app.vue
@@ -1,15 +1,28 @@
 <script setup>
 import { VueQueryDevtools } from "@tanstack/vue-query-devtools";
+
+// state
+
+const {
+    $updateAvailable: updateAvailable,
+    $handleUpdate: handleUpdate,
+    $handleUpdateAvailable: handleUpdateAvailable,
+} = useNuxtApp();
 </script>
 
 <template>
     <div>
         <LoadingIndicator />
 
-        <NuxtRouteAnnouncer />
+        <NuxtPwaManifest />
+
+        <UpdatePwaModal
+            :isShow="updateAvailable"
+            @update="handleUpdate"
+            @close="handleUpdateAvailable"
+        />
 
         <NuxtLayout>
-
             <ToastProvider>
                 <NuxtPage />
 
@@ -21,6 +34,5 @@ import { VueQueryDevtools } from "@tanstack/vue-query-devtools";
         </NuxtLayout>
 
         <VueQueryDevtools dir="ltr" buttonPosition="bottom-left" />
-
     </div>
 </template>