From 62fb4caf3f1925751dab42fe029e69252a366ee4 Mon Sep 17 00:00:00 2001
From: silverwind <me@silverwind.io>
Date: Tue, 28 Oct 2025 18:26:45 +0100
Subject: [PATCH 1/3] Enable `vue/require-typed-ref` eslint rule

---
 eslint.config.ts                       |  1 +
 web_src/js/components/ContextPopup.vue |  9 +++++----
 web_src/js/types.ts                    | 16 +++++++++++-----
 3 files changed, 17 insertions(+), 9 deletions(-)

diff --git a/eslint.config.ts b/eslint.config.ts
index d9c4bcae3a65e..2a9684933f810 100644
--- a/eslint.config.ts
+++ b/eslint.config.ts
@@ -921,6 +921,7 @@ export default defineConfig([
       'vue/html-closing-bracket-spacing': [2, {startTag: 'never', endTag: 'never', selfClosingTag: 'never'}],
       'vue/max-attributes-per-line': [0],
       'vue/singleline-html-element-content-newline': [0],
+      'vue/require-typed-ref': [2],
     },
   },
   {
diff --git a/web_src/js/components/ContextPopup.vue b/web_src/js/components/ContextPopup.vue
index aebfaa5d26fc0..3e1ff305c63ee 100644
--- a/web_src/js/components/ContextPopup.vue
+++ b/web_src/js/components/ContextPopup.vue
@@ -3,16 +3,17 @@ import {SvgIcon} from '../svg.ts';
 import {GET} from '../modules/fetch.ts';
 import {getIssueColor, getIssueIcon} from '../features/issue.ts';
 import {computed, onMounted, shallowRef} from 'vue';
+import type {Issue} from '../types.ts';
 
 const props = defineProps<{
   repoLink: string,
   loadIssueInfoUrl: string,
 }>();
 
-const loading = shallowRef(false);
-const issue = shallowRef(null);
-const renderedLabels = shallowRef('');
-const errorMessage = shallowRef(null);
+const loading = shallowRef<boolean>(false);
+const issue = shallowRef<Issue>(null);
+const renderedLabels = shallowRef<string>('');
+const errorMessage = shallowRef<string | null>(null);
 
 const createdAt = computed(() => {
   return new Date(issue.value.created_at).toLocaleDateString(undefined, {year: 'numeric', month: 'short', day: 'numeric'});
diff --git a/web_src/js/types.ts b/web_src/js/types.ts
index 56d6c56d13433..31f41766e7a7d 100644
--- a/web_src/js/types.ts
+++ b/web_src/js/types.ts
@@ -52,14 +52,20 @@ export type IssuePageInfo = {
 };
 
 export type Issue = {
-  id: number;
-  number: number;
-  title: string;
-  state: 'open' | 'closed';
+  id: number,
+  number: number,
+  title: string,
+  body: string,
+  state: 'open' | 'closed',
+  created_at: string,
   pull_request?: {
     draft: boolean;
     merged: boolean;
-  };
+  },
+  repository: {
+    full_name: string,
+  },
+  labels: Array<string>,
 };
 
 export type FomanticInitFunction = {

From da52a9300f6d04c18d9ed1f40d76145cbb0de002 Mon Sep 17 00:00:00 2001
From: silverwind <me@silverwind.io>
Date: Tue, 28 Oct 2025 18:28:04 +0100
Subject: [PATCH 2/3] omit null

---
 web_src/js/components/ContextPopup.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/web_src/js/components/ContextPopup.vue b/web_src/js/components/ContextPopup.vue
index 3e1ff305c63ee..cf157461e82dd 100644
--- a/web_src/js/components/ContextPopup.vue
+++ b/web_src/js/components/ContextPopup.vue
@@ -13,7 +13,7 @@ const props = defineProps<{
 const loading = shallowRef<boolean>(false);
 const issue = shallowRef<Issue>(null);
 const renderedLabels = shallowRef<string>('');
-const errorMessage = shallowRef<string | null>(null);
+const errorMessage = shallowRef<string>(null);
 
 const createdAt = computed(() => {
   return new Date(issue.value.created_at).toLocaleDateString(undefined, {year: 'numeric', month: 'short', day: 'numeric'});

From 187013aa51d649b09d64d7896168ad0c7d1c9689 Mon Sep 17 00:00:00 2001
From: silverwind <me@silverwind.io>
Date: Wed, 29 Oct 2025 09:15:49 +0100
Subject: [PATCH 3/3] fixes

---
 web_src/js/components/ContextPopup.vue | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/web_src/js/components/ContextPopup.vue b/web_src/js/components/ContextPopup.vue
index cf157461e82dd..31db902adce96 100644
--- a/web_src/js/components/ContextPopup.vue
+++ b/web_src/js/components/ContextPopup.vue
@@ -10,10 +10,10 @@ const props = defineProps<{
   loadIssueInfoUrl: string,
 }>();
 
-const loading = shallowRef<boolean>(false);
+const loading = shallowRef(false);
 const issue = shallowRef<Issue>(null);
-const renderedLabels = shallowRef<string>('');
-const errorMessage = shallowRef<string>(null);
+const renderedLabels = shallowRef('');
+const errorMessage = shallowRef('');
 
 const createdAt = computed(() => {
   return new Date(issue.value.created_at).toLocaleDateString(undefined, {year: 'numeric', month: 'short', day: 'numeric'});
@@ -26,7 +26,7 @@ const body = computed(() => {
 
 onMounted(async () => {
   loading.value = true;
-  errorMessage.value = null;
+  errorMessage.value = '';
   try {
     const resp = await GET(props.loadIssueInfoUrl);
     if (!resp.ok) {