From b6a4174c935d884a2ceddc8c45fdced4e4343477 Mon Sep 17 00:00:00 2001
From: Kazuki Yamada <koukun0120@gmail.com>
Date: Tue, 23 Sep 2025 18:37:57 +0900
Subject: [PATCH 1/5] feat(website): improve timeout handling with warning
 display

- Add onAbort callback to distinguish timeouts from errors
- Implement errorType system to differentiate warnings from errors
- Update TryItResultErrorContent to show warning styling for timeouts
- Change timeout message to suggest using Include/Ignore Patterns
- Timeout now displays with yellow warning icon instead of red error
---
 website/client/components/Home/TryIt.vue      |  2 ++
 .../client/components/Home/TryItResult.vue    |  2 ++
 .../Home/TryItResultErrorContent.vue          | 30 ++++++++++++++-----
 .../components/utils/requestHandlers.ts       | 23 +++++++++++---
 website/client/composables/usePackRequest.ts  | 15 ++++++++--
 5 files changed, 59 insertions(+), 13 deletions(-)

diff --git a/website/client/components/Home/TryIt.vue b/website/client/components/Home/TryIt.vue
index d143bec27..b35249c77 100644
--- a/website/client/components/Home/TryIt.vue
+++ b/website/client/components/Home/TryIt.vue
@@ -92,6 +92,7 @@
           :result="result"
           :loading="loading"
           :error="error"
+          :error-type="errorType"
           :repository-url="inputRepositoryUrl"
           @repack="handleRepack"
         />
@@ -129,6 +130,7 @@ const {
   // Request states
   loading,
   error,
+  errorType,
   result,
   hasExecuted,
 
diff --git a/website/client/components/Home/TryItResult.vue b/website/client/components/Home/TryItResult.vue
index 9e3fd8c6d..bff3b380a 100644
--- a/website/client/components/Home/TryItResult.vue
+++ b/website/client/components/Home/TryItResult.vue
@@ -11,6 +11,7 @@ interface Props {
   result?: PackResult | null;
   loading?: boolean;
   error?: string | null;
+  errorType?: 'error' | 'warning';
   repositoryUrl?: string;
 }
 
@@ -50,6 +51,7 @@ const handleRepack = (selectedFiles: FileInfo[]) => {
     <TryItResultErrorContent
       v-else-if="error"
       :message="error"
+      :error-type="errorType"
       :repository-url="repositoryUrl"
     />
     <div v-else-if="result" class="result-content">
diff --git a/website/client/components/Home/TryItResultErrorContent.vue b/website/client/components/Home/TryItResultErrorContent.vue
index fddfeb7d1..14367f8d5 100644
--- a/website/client/components/Home/TryItResultErrorContent.vue
+++ b/website/client/components/Home/TryItResultErrorContent.vue
@@ -1,10 +1,11 @@
 <script setup lang="ts">
-import { AlertTriangle, Copy } from 'lucide-vue-next';
+import { AlertTriangle, AlertCircle, Copy } from 'lucide-vue-next';
 import { computed, ref } from 'vue';
 
 const props = defineProps<{
   message: string;
   repositoryUrl?: string;
+  errorType?: 'error' | 'warning';
 }>();
 
 const copied = ref(false);
@@ -25,10 +26,11 @@ const copyCommand = async (event: Event) => {
 </script>
 
 <template>
-  <div class="error">
-    <div class="error-content">
-      <AlertTriangle :size="32" class="error-icon" />
-      <p class="error-message">{{ message }}</p>
+  <div :class="errorType === 'warning' ? 'warning' : 'error'">
+    <div class="content">
+      <AlertCircle v-if="errorType === 'warning'" :size="32" class="warning-icon" />
+      <AlertTriangle v-else :size="32" class="error-icon" />
+      <p :class="errorType === 'warning' ? 'warning-message' : 'error-message'">{{ message }}</p>
       <div class="suggestion">
         <p>Try using the command line tool instead:</p>
         <div class="command-block">
@@ -47,14 +49,15 @@ const copyCommand = async (event: Event) => {
 </template>
 
 <style scoped>
-.error {
+.error,
+.warning {
   padding: 32px;
   display: flex;
   justify-content: center;
   align-items: center;
 }
 
-.error-content {
+.content {
   max-width: 700px;
   width: 100%;
   display: flex;
@@ -68,10 +71,23 @@ const copyCommand = async (event: Event) => {
   margin-bottom: 16px;
 }
 
+.warning-icon {
+  color: var(--vp-c-warning-1);
+  margin-bottom: 16px;
+}
+
 .error-message {
   color: var(--vp-c-danger-1);
   font-size: 1.1em;
   margin: 0 0 24px;
+  white-space: pre-wrap;
+}
+
+.warning-message {
+  color: var(--vp-c-warning-1);
+  font-size: 1.1em;
+  margin: 0 0 24px;
+  white-space: pre-wrap;
 }
 
 .suggestion {
diff --git a/website/client/components/utils/requestHandlers.ts b/website/client/components/utils/requestHandlers.ts
index 9c8ac186e..5cef28020 100644
--- a/website/client/components/utils/requestHandlers.ts
+++ b/website/client/components/utils/requestHandlers.ts
@@ -5,6 +5,7 @@ import { type AnalyticsActionType, analyticsUtils } from './analytics';
 interface RequestHandlerOptions {
   onSuccess?: (result: PackResult) => void;
   onError?: (error: string) => void;
+  onAbort?: (message: string) => void;
   signal?: AbortSignal;
   file?: File;
 }
@@ -18,7 +19,7 @@ export async function handlePackRequest(
   options: PackOptions,
   handlerOptions: RequestHandlerOptions = {},
 ): Promise<void> {
-  const { onSuccess, onError, signal, file } = handlerOptions;
+  const { onSuccess, onError, onAbort, signal, file } = handlerOptions;
   const processedUrl = url.trim();
 
   // Track pack start
@@ -46,14 +47,28 @@ export async function handlePackRequest(
 
     onSuccess?.(response);
   } catch (err) {
-    const errorMessage = err instanceof Error ? err.message : 'An unexpected error occurred';
+    // Check for abort/timeout first, regardless of error type
+    if (signal?.aborted) {
+      const isTimeout = String(signal?.reason) === 'timeout';
+      if (isTimeout) {
+        onAbort?.('Request timed out.\nPlease consider using Include Patterns or Ignore Patterns to reduce the scope.');
+        return;
+      }
 
-    if (errorMessage === 'AbortError') {
-      onError?.('Request was cancelled');
+      onAbort?.('Request was cancelled');
       return;
     }
 
+    let errorMessage: string;
+
+    if (err instanceof Error) {
+      errorMessage = err.message;
+    } else {
+      errorMessage = 'An unexpected error occurred';
+    }
+
     analyticsUtils.trackPackError(processedUrl, errorMessage);
+
     console.error('Error processing repository:', err);
     onError?.(errorMessage);
   }
diff --git a/website/client/composables/usePackRequest.ts b/website/client/composables/usePackRequest.ts
index 36e084d75..d3d577a4e 100644
--- a/website/client/composables/usePackRequest.ts
+++ b/website/client/composables/usePackRequest.ts
@@ -21,12 +21,14 @@ export function usePackRequest() {
   // Request states
   const loading = ref(false);
   const error = ref<string | null>(null);
+  const errorType = ref<'error' | 'warning'>('error');
   const result = ref<PackResult | null>(null);
   const hasExecuted = ref(false);
 
   // Request controller for cancellation
   let requestController: AbortController | null = null;
-  const TIMEOUT_MS = 30_000;
+  let isTimeout = false;
+  const TIMEOUT_MS = 2_000;
 
   // Computed validation
   const isSubmitValid = computed(() => {
@@ -51,6 +53,7 @@ export function usePackRequest() {
 
   function resetRequest() {
     error.value = null;
+    errorType.value = 'error';
     result.value = null;
     hasExecuted.value = false;
   }
@@ -66,13 +69,16 @@ export function usePackRequest() {
 
     loading.value = true;
     error.value = null;
+    errorType.value = 'error';
     result.value = null;
     hasExecuted.value = true;
+    isTimeout = false;
     inputRepositoryUrl.value = inputUrl.value;
 
     const timeoutId = setTimeout(() => {
       if (requestController) {
-        requestController.abort('Request timed out');
+        isTimeout = true;
+        requestController.abort('timeout');
       }
     }, TIMEOUT_MS);
 
@@ -88,6 +94,10 @@ export function usePackRequest() {
           onError: (errorMessage) => {
             error.value = errorMessage;
           },
+          onAbort: (message) => {
+            error.value = message;
+            errorType.value = 'warning';
+          },
           signal: requestController.signal,
           file: mode.value === 'file' || mode.value === 'folder' ? uploadedFile.value || undefined : undefined,
         },
@@ -167,6 +177,7 @@ export function usePackRequest() {
     // Request states
     loading,
     error,
+    errorType,
     result,
     hasExecuted,
 

From d9e141ec654a9e3f4ce958a1e449eab009fbd214 Mon Sep 17 00:00:00 2001
From: Kazuki Yamada <koukun0120@gmail.com>
Date: Tue, 23 Sep 2025 19:52:10 +0900
Subject: [PATCH 2/5] feat(website): add cancel functionality for pack requests

Implement cancel button for pack requests with improved user experience.
The button now shows "Cancel" on hover during processing and allows users
to abort ongoing requests. Also improved error messages for better clarity.

- Add cancel functionality to PackButton with hover state
- Implement request cancellation using AbortController
- Improve error messages for remote repository processing failures
- Update timeout handling and server configuration
- Add proper event handling to prevent form submission conflicts
---
 website/client/components/Home/PackButton.vue | 49 +++++++++++++++++--
 website/client/components/Home/TryIt.vue      | 12 +++++
 .../components/Home/TryItFileUpload.vue       |  2 +
 .../components/Home/TryItFolderUpload.vue     |  2 +
 .../Home/TryItResultErrorContent.vue          |  2 +-
 .../client/components/Home/TryItUrlInput.vue  |  3 +-
 .../components/utils/requestHandlers.ts       |  8 ++-
 website/client/composables/usePackRequest.ts  |  8 ++-
 website/server/cloudbuild.yaml                |  4 +-
 website/server/src/domains/pack/remoteRepo.ts |  6 +--
 website/server/src/index.ts                   |  2 +-
 website/server/src/middlewares/rateLimit.ts   |  2 +-
 12 files changed, 80 insertions(+), 20 deletions(-)

diff --git a/website/client/components/Home/PackButton.vue b/website/client/components/Home/PackButton.vue
index 53ee00583..613b14a42 100644
--- a/website/client/components/Home/PackButton.vue
+++ b/website/client/components/Home/PackButton.vue
@@ -1,11 +1,18 @@
 <template>
   <button
     class="pack-button"
-    :disabled="!isValid || loading"
-    aria-label="Pack repository"
+    :class="{ 'pack-button--loading': loading }"
+    :disabled="!isValid && !loading"
+    :aria-label="loading ? 'Cancel processing' : 'Pack repository'"
     type="submit"
+    @click="handleClick"
   >
-    {{ loading ? 'Processing...' : 'Pack' }}
+    <span class="pack-button__text pack-button__text--normal">
+      {{ loading ? 'Processing...' : 'Pack' }}
+    </span>
+    <span class="pack-button__text pack-button__text--hover">
+      {{ loading ? 'Cancel' : 'Pack' }}
+    </span>
     <PackIcon v-if="!loading" :size="20" />
   </button>
 </template>
@@ -13,10 +20,20 @@
 <script setup>
 import PackIcon from './PackIcon.vue';
 
-defineProps({
+const props = defineProps({
   loading: Boolean,
   isValid: Boolean,
 });
+
+const emit = defineEmits(['cancel']);
+
+function handleClick(event) {
+  if (props.loading) {
+    event.preventDefault();
+    event.stopPropagation();
+    emit('cancel');
+  }
+}
 </script>
 
 <style scoped>
@@ -36,18 +53,40 @@ defineProps({
   border-radius: 8px;
   cursor: pointer;
   transition: all 0.2s ease;
-
+  position: relative;
 }
 
 .pack-button:hover:not(:disabled) {
   background: var(--vp-c-brand-2);
 }
 
+.pack-button--loading:hover {
+  background: var(--vp-c-danger-1);
+}
+
 .pack-button:disabled {
   opacity: 0.5;
   cursor: not-allowed;
 }
 
+.pack-button__text {
+  transition: opacity 0.2s ease;
+}
+
+.pack-button__text--hover {
+  position: absolute;
+  opacity: 0;
+  pointer-events: none;
+}
+
+.pack-button--loading:hover .pack-button__text--normal {
+  opacity: 0;
+}
+
+.pack-button--loading:hover .pack-button__text--hover {
+  opacity: 1;
+}
+
 .pack-button-icon {
   font-size: 20px;
   line-height: 1;
diff --git a/website/client/components/Home/TryIt.vue b/website/client/components/Home/TryIt.vue
index b35249c77..6921b0ac4 100644
--- a/website/client/components/Home/TryIt.vue
+++ b/website/client/components/Home/TryIt.vue
@@ -53,6 +53,7 @@
           <PackButton
             :loading="loading"
             :isValid="isSubmitValid"
+            @cancel="handleCancel"
           />
           <div
             v-if="shouldShowReset"
@@ -143,6 +144,7 @@ const {
   submitRequest,
   repackWithSelectedFiles,
   resetOptions,
+  cancelRequest,
 } = usePackRequest();
 
 // Check if reset button should be shown
@@ -181,6 +183,12 @@ function updateUrlFromCurrentState() {
 }
 
 async function handleSubmit(event?: SubmitEvent) {
+  // Prevent form submission when already loading
+  if (loading.value) {
+    event?.preventDefault();
+    return;
+  }
+
   // Prevent accidental form submissions from unintended buttons
   if (event?.submitter && !isSubmitValid.value) {
     const submitter = event.submitter as HTMLElement;
@@ -215,6 +223,10 @@ function handleRepack(selectedFiles: FileInfo[]) {
   repackWithSelectedFiles(selectedFiles);
 }
 
+function handleCancel() {
+  cancelRequest();
+}
+
 // Watch for changes in packOptions and inputUrl to update URL in real-time
 watch(
   [packOptions, inputUrl],
diff --git a/website/client/components/Home/TryItFileUpload.vue b/website/client/components/Home/TryItFileUpload.vue
index e66e076ab..b71af4b2e 100644
--- a/website/client/components/Home/TryItFileUpload.vue
+++ b/website/client/components/Home/TryItFileUpload.vue
@@ -11,6 +11,7 @@ const props = defineProps<{
 
 const emit = defineEmits<{
   upload: [file: File];
+  cancel: [];
 }>();
 
 const { validateZipFile } = useZipProcessor();
@@ -100,6 +101,7 @@ function clearFile() {
     <PackButton
       :loading="loading"
       :isValid="isValid"
+      @cancel="$emit('cancel')"
     />
   </div>
 </template>
diff --git a/website/client/components/Home/TryItFolderUpload.vue b/website/client/components/Home/TryItFolderUpload.vue
index 647aad6b7..38a262799 100644
--- a/website/client/components/Home/TryItFolderUpload.vue
+++ b/website/client/components/Home/TryItFolderUpload.vue
@@ -11,6 +11,7 @@ const props = defineProps<{
 
 const emit = defineEmits<{
   upload: [file: File];
+  cancel: [];
 }>();
 
 const { createZipFromFiles } = useZipProcessor();
@@ -110,6 +111,7 @@ function clearFolder() {
     <PackButton
       :loading="loading"
       :isValid="isValid"
+      @cancel="$emit('cancel')"
     />
   </div>
 </template>
diff --git a/website/client/components/Home/TryItResultErrorContent.vue b/website/client/components/Home/TryItResultErrorContent.vue
index 14367f8d5..fe6334045 100644
--- a/website/client/components/Home/TryItResultErrorContent.vue
+++ b/website/client/components/Home/TryItResultErrorContent.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { AlertTriangle, AlertCircle, Copy } from 'lucide-vue-next';
+import { AlertCircle, AlertTriangle, Copy } from 'lucide-vue-next';
 import { computed, ref } from 'vue';
 
 const props = defineProps<{
diff --git a/website/client/components/Home/TryItUrlInput.vue b/website/client/components/Home/TryItUrlInput.vue
index d565e570b..c66a95e09 100644
--- a/website/client/components/Home/TryItUrlInput.vue
+++ b/website/client/components/Home/TryItUrlInput.vue
@@ -14,6 +14,7 @@ const emit = defineEmits<{
   'update:url': [value: string];
   submit: [];
   keydown: [event: KeyboardEvent];
+  cancel: [];
 }>();
 
 const isValidUrl = computed(() => {
@@ -114,7 +115,7 @@ function handleKeydown(event: KeyboardEvent) {
       <span>Please enter a valid GitHub repository URL (e.g., yamadashy/repomix)</span>
     </div>
     <div v-if="showButton" class="pack-button-container">
-      <PackButton :isValid="isValidUrl" :loading="loading" @click="handleSubmit"/>
+      <PackButton :isValid="isValidUrl" :loading="loading" @click="handleSubmit" @cancel="$emit('cancel')"/>
     </div>
   </div>
 </template>
diff --git a/website/client/components/utils/requestHandlers.ts b/website/client/components/utils/requestHandlers.ts
index 5cef28020..f6424663e 100644
--- a/website/client/components/utils/requestHandlers.ts
+++ b/website/client/components/utils/requestHandlers.ts
@@ -55,7 +55,13 @@ export async function handlePackRequest(
         return;
       }
 
-      onAbort?.('Request was cancelled');
+      const isCancelled = String(signal?.reason) === 'cancel';
+      if (isCancelled) {
+        onAbort?.('Request was cancelled.');
+        return;
+      }
+
+      onAbort?.('Request was cancelled with an unknown reason.');
       return;
     }
 
diff --git a/website/client/composables/usePackRequest.ts b/website/client/composables/usePackRequest.ts
index d3d577a4e..f5b36beeb 100644
--- a/website/client/composables/usePackRequest.ts
+++ b/website/client/composables/usePackRequest.ts
@@ -27,8 +27,7 @@ export function usePackRequest() {
 
   // Request controller for cancellation
   let requestController: AbortController | null = null;
-  let isTimeout = false;
-  const TIMEOUT_MS = 2_000;
+  const TIMEOUT_MS = 30_000;
 
   // Computed validation
   const isSubmitValid = computed(() => {
@@ -72,12 +71,11 @@ export function usePackRequest() {
     errorType.value = 'error';
     result.value = null;
     hasExecuted.value = true;
-    isTimeout = false;
     inputRepositoryUrl.value = inputUrl.value;
 
+    // Set up automatic timeout
     const timeoutId = setTimeout(() => {
       if (requestController) {
-        isTimeout = true;
         requestController.abort('timeout');
       }
     }, TIMEOUT_MS);
@@ -142,7 +140,7 @@ export function usePackRequest() {
 
   function cancelRequest() {
     if (requestController) {
-      requestController.abort();
+      requestController.abort('cancel');
       requestController = null;
     }
     loading.value = false;
diff --git a/website/server/cloudbuild.yaml b/website/server/cloudbuild.yaml
index d8a7dc72f..2ae09b031 100644
--- a/website/server/cloudbuild.yaml
+++ b/website/server/cloudbuild.yaml
@@ -38,13 +38,13 @@ steps:
       - '--memory'
       - '1024Mi'
       - '--cpu'
-      - '1'
+      - '2'
       - '--min-instances'
       - '0'
       - '--max-instances'
       - '10'
       - '--timeout'
-      - '31s'
+      - '35s'
       - '--ingress'
       - 'all'
       - '--allow-unauthenticated'
diff --git a/website/server/src/domains/pack/remoteRepo.ts b/website/server/src/domains/pack/remoteRepo.ts
index 78ebf378c..e603ac44f 100644
--- a/website/server/src/domains/pack/remoteRepo.ts
+++ b/website/server/src/domains/pack/remoteRepo.ts
@@ -103,11 +103,11 @@ export async function processRemoteRepo(repoUrl: string, format: string, options
 
     return packResultData;
   } catch (error) {
-    console.error('Error in remote action:', error);
+    console.error('Error in remote repository processing:', error);
     if (error instanceof Error) {
-      throw new AppError(`Remote action failed: ${error.message}`, 500);
+      throw new AppError(`Remote repository processing failed.\nThe repository may not be public or there may be an issue with Repomix.\n\n${error.message}`, 500);
     }
-    throw new AppError('Remote action failed with unknown error', 500);
+    throw new AppError('Remote repository processing failed.\nThe repository may not be public or there may be an issue with Repomix.', 500);
   } finally {
     // Clean up the output file
     try {
diff --git a/website/server/src/index.ts b/website/server/src/index.ts
index 29893e70e..d78bf5ed2 100644
--- a/website/server/src/index.ts
+++ b/website/server/src/index.ts
@@ -31,7 +31,7 @@ app.use('/*', corsMiddleware);
 app.use(compress());
 
 // Set timeout for API routes
-app.use('/api', timeout(30000));
+app.use('/api', timeout(35_000));
 
 // Setup custom logger
 app.use('*', cloudLoggerMiddleware());
diff --git a/website/server/src/middlewares/rateLimit.ts b/website/server/src/middlewares/rateLimit.ts
index d6db8183c..7344030cf 100644
--- a/website/server/src/middlewares/rateLimit.ts
+++ b/website/server/src/middlewares/rateLimit.ts
@@ -10,7 +10,7 @@ export function rateLimitMiddleware() {
     // Check rate limit
     if (!rateLimiter.isAllowed(clientInfo.ip)) {
       const remainingTime = Math.ceil(rateLimiter.getRemainingTime(clientInfo.ip) / 1000);
-      const message = `Rate limit exceeded. Please try again in ${remainingTime} seconds.`;
+      const message = `Rate limit exceeded.\nPlease try again in ${remainingTime} seconds.`;
       const requestId = c.get('requestId');
       return c.json(createErrorResponse(message, requestId), 429);
     }

From d6b4a363be840bf19d8ebb4c8f44f6bea89a5e65 Mon Sep 17 00:00:00 2001
From: "autofix-ci[bot]" <114827586+autofix-ci[bot]@users.noreply.github.com>
Date: Tue, 23 Sep 2025 11:37:42 +0000
Subject: [PATCH 3/5] [autofix.ci] apply automated fixes

---
 website/server/src/domains/pack/remoteRepo.ts | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/website/server/src/domains/pack/remoteRepo.ts b/website/server/src/domains/pack/remoteRepo.ts
index e603ac44f..f930dba08 100644
--- a/website/server/src/domains/pack/remoteRepo.ts
+++ b/website/server/src/domains/pack/remoteRepo.ts
@@ -105,9 +105,15 @@ export async function processRemoteRepo(repoUrl: string, format: string, options
   } catch (error) {
     console.error('Error in remote repository processing:', error);
     if (error instanceof Error) {
-      throw new AppError(`Remote repository processing failed.\nThe repository may not be public or there may be an issue with Repomix.\n\n${error.message}`, 500);
+      throw new AppError(
+        `Remote repository processing failed.\nThe repository may not be public or there may be an issue with Repomix.\n\n${error.message}`,
+        500,
+      );
     }
-    throw new AppError('Remote repository processing failed.\nThe repository may not be public or there may be an issue with Repomix.', 500);
+    throw new AppError(
+      'Remote repository processing failed.\nThe repository may not be public or there may be an issue with Repomix.',
+      500,
+    );
   } finally {
     // Clean up the output file
     try {

From 12ea47b472af770559cde8bf32ae1282e23f24a2 Mon Sep 17 00:00:00 2001
From: Kazuki Yamada <koukun0120@gmail.com>
Date: Tue, 23 Sep 2025 22:04:20 +0900
Subject: [PATCH 4/5] refactor(website): address PR review feedback for type
 safety and code quality

Improve type safety and code quality based on PR review comments:
- Convert PackButton.vue to TypeScript with proper type definitions
- Fix AbortSignal.reason comparison using strict equality instead of String()
- Extract magic number constant for API timeout in server configuration

These changes enhance type safety, improve code robustness, and increase
maintainability as suggested by automated code reviewers.
---
 website/client/components/Home/PackButton.vue    | 16 +++++++++-------
 .../client/components/utils/requestHandlers.ts   |  4 ++--
 website/server/src/index.ts                      |  4 +++-
 3 files changed, 14 insertions(+), 10 deletions(-)

diff --git a/website/client/components/Home/PackButton.vue b/website/client/components/Home/PackButton.vue
index 613b14a42..24c117a01 100644
--- a/website/client/components/Home/PackButton.vue
+++ b/website/client/components/Home/PackButton.vue
@@ -17,17 +17,19 @@
   </button>
 </template>
 
-<script setup>
+<script setup lang="ts">
 import PackIcon from './PackIcon.vue';
 
-const props = defineProps({
-  loading: Boolean,
-  isValid: Boolean,
-});
+const props = defineProps<{
+  loading?: boolean;
+  isValid?: boolean;
+}>();
 
-const emit = defineEmits(['cancel']);
+const emit = defineEmits<{
+  (e: 'cancel'): void;
+}>();
 
-function handleClick(event) {
+function handleClick(event: MouseEvent) {
   if (props.loading) {
     event.preventDefault();
     event.stopPropagation();
diff --git a/website/client/components/utils/requestHandlers.ts b/website/client/components/utils/requestHandlers.ts
index f6424663e..0ca0c0964 100644
--- a/website/client/components/utils/requestHandlers.ts
+++ b/website/client/components/utils/requestHandlers.ts
@@ -49,13 +49,13 @@ export async function handlePackRequest(
   } catch (err) {
     // Check for abort/timeout first, regardless of error type
     if (signal?.aborted) {
-      const isTimeout = String(signal?.reason) === 'timeout';
+      const isTimeout = signal?.reason === 'timeout';
       if (isTimeout) {
         onAbort?.('Request timed out.\nPlease consider using Include Patterns or Ignore Patterns to reduce the scope.');
         return;
       }
 
-      const isCancelled = String(signal?.reason) === 'cancel';
+      const isCancelled = signal?.reason === 'cancel';
       if (isCancelled) {
         onAbort?.('Request was cancelled.');
         return;
diff --git a/website/server/src/index.ts b/website/server/src/index.ts
index d78bf5ed2..a1b6e3113 100644
--- a/website/server/src/index.ts
+++ b/website/server/src/index.ts
@@ -10,6 +10,8 @@ import { rateLimitMiddleware } from './middlewares/rateLimit.js';
 import { logInfo, logMemoryUsage } from './utils/logger.js';
 import { getProcessConcurrency } from './utils/processConcurrency.js';
 
+const API_TIMEOUT_MS = 35_000;
+
 // Log server metrics on startup
 logInfo('Server starting', {
   metrics: {
@@ -31,7 +33,7 @@ app.use('/*', corsMiddleware);
 app.use(compress());
 
 // Set timeout for API routes
-app.use('/api', timeout(35_000));
+app.use('/api', timeout(API_TIMEOUT_MS));
 
 // Setup custom logger
 app.use('*', cloudLoggerMiddleware());

From f1d8f974d4557f754ddba8fe8ac2205e3007be79 Mon Sep 17 00:00:00 2001
From: "autofix-ci[bot]" <114827586+autofix-ci[bot]@users.noreply.github.com>
Date: Tue, 23 Sep 2025 13:05:11 +0000
Subject: [PATCH 5/5] [autofix.ci] apply automated fixes

---
 website/client/components/Home/PackButton.vue | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/website/client/components/Home/PackButton.vue b/website/client/components/Home/PackButton.vue
index 24c117a01..ebc9f3abc 100644
--- a/website/client/components/Home/PackButton.vue
+++ b/website/client/components/Home/PackButton.vue
@@ -25,9 +25,7 @@ const props = defineProps<{
   isValid?: boolean;
 }>();
 
-const emit = defineEmits<{
-  (e: 'cancel'): void;
-}>();
+const emit = defineEmits<(e: 'cancel') => void>();
 
 function handleClick(event: MouseEvent) {
   if (props.loading) {