Add pr review

package.json

@@ -3,7 +3,7 @@
   "version": "2.0.0",
   "private": true,
   "type": "module",
-  "packageManager": "pnpm@10.17.0",
+  "packageManager": "pnpm@10.16.1",
   "scripts": {
     "dev": "vite",
     "test": "vitest run",
@@ -39,52 +39,57 @@
     "pnpm": ">=9.0.0"
   },
   "dependencies": {
-    "@sentry/browser": "^10.34.0",
-    "@sentry/svelte": "^10.34.0",
-    "@sentry/sveltekit": "^10.34.0",
-    "@sentry/vite-plugin": "^4.6.2",
-    "firebase": "^12.8.0",
-    "graphql": "^16.12.0",
-    "tailwindcss": "^4.1.18"
+    "@octokit/core": "^7.0.6",
+    "@octokit/plugin-retry": "^8.1.0",
+    "@octokit/plugin-throttling": "^11.0.3",
+    "@sentry/browser": "^10.40.0",
+    "@sentry/svelte": "^10.40.0",
+    "@sentry/sveltekit": "^10.40.0",
+    "@sentry/vite-plugin": "^4.9.1",
+    "firebase": "^12.9.0",
+    "highlight.js": "^11.11.1",
+    "marked": "^16.4.2",
+    "tailwindcss": "^4.2.1"
   },
   "devDependencies": {
-    "@eslint/js": "^9.39.2",
-    "@playwright/test": "^1.57.0",
+    "@eslint/js": "^9.39.3",
+    "@octokit/types": "^16.0.0",
+    "@playwright/test": "^1.58.2",
     "@sveltejs/adapter-static": "^3.0.10",
-    "@sveltejs/kit": "^2.50.0",
+    "@sveltejs/kit": "^2.53.2",
     "@sveltejs/vite-plugin-svelte": "^6.2.4",
-    "@tailwindcss/vite": "^4.1.18",
+    "@tailwindcss/vite": "^4.2.1",
     "@testing-library/jest-dom": "^6.9.1",
     "@testing-library/svelte": "^5.3.1",
     "@tsconfig/svelte": "5.0.6",
-    "@typescript-eslint/eslint-plugin": "^8.53.0",
-    "@typescript-eslint/parser": "^8.53.0",
+    "@typescript-eslint/eslint-plugin": "^8.56.1",
+    "@typescript-eslint/parser": "^8.56.1",
     "@vite-pwa/assets-generator": "^1.0.2",
     "@vite-pwa/sveltekit": "^1.1.0",
-    "@vitest/coverage-v8": "^4.0.17",
-    "@vitest/ui": "^4.0.17",
-    "eslint": "^9.39.2",
+    "@vitest/coverage-v8": "^4.0.18",
+    "@vitest/ui": "^4.0.18",
+    "eslint": "^9.39.3",
     "eslint-config-prettier": "^10.1.8",
     "eslint-plugin-prettier": "^5.5.5",
-    "eslint-plugin-svelte": "^3.14.0",
-    "firebase-tools": "^15.3.1",
+    "eslint-plugin-svelte": "^3.15.0",
+    "firebase-tools": "^15.8.0",
     "jsdom": "^27.4.0",
-    "msw": "^2.12.7",
-    "prettier": "^3.8.0",
-    "prettier-plugin-svelte": "^3.4.1",
+    "msw": "^2.12.10",
+    "prettier": "^3.8.1",
+    "prettier-plugin-svelte": "^3.5.0",
     "sharp": "0.34.5",
     "sharp-ico": "0.1.5",
-    "svelte": "^5.47.0",
-    "svelte-check": "^4.3.5",
-    "svelte-eslint-parser": "^1.4.1",
+    "svelte": "^5.53.5",
+    "svelte-check": "^4.4.4",
+    "svelte-eslint-parser": "^1.5.1",
     "svelte-preprocess": "^6.0.3",
     "tslib": "2.8.1",
     "typescript": "^5.9.3",
-    "typescript-eslint": "^8.53.0",
+    "typescript-eslint": "^8.56.1",
     "vite": "^7.3.1",
     "vite-plugin-compression": "^0.5.1",
     "vite-plugin-pwa": "^1.2.0",
-    "vitest": "^4.0.17",
+    "vitest": "^4.0.18",
     "workbox-window": "^7.4.0"
   },
   "pnpm": {

src/features/actions/List.svelte

@@ -5,7 +5,8 @@
 
   let { org, repo, workflowRuns = [] } = $props();
 
-  const repoKey = `${org}/${repo}`;
+  const repoKey = $derived(`${org}/${repo}`);
+  const isCollapsed = $derived(repositoryCollapseStore.isCollapsed(repoKey, $repositoryCollapseStore));
 
   function toggleCollapse() {
     repositoryCollapseStore.toggle(repoKey);
@@ -19,9 +20,9 @@
         <button 
           onclick={toggleCollapse}
           class="text-[#8b949e] hover:text-[#c9d1d9] transition-colors p-1 rounded hover:bg-[#21262d]"
-          title={repositoryCollapseStore.isCollapsed(repoKey, $repositoryCollapseStore) ? 'Expand repository' : 'Collapse repository'}
+          title={isCollapsed ? 'Expand repository' : 'Collapse repository'}
         >
-          {#if repositoryCollapseStore.isCollapsed(repoKey, $repositoryCollapseStore)}
+          {#if isCollapsed}
             <!-- Expand icon (chevron right) -->
             <svg width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
               <path fill-rule="evenodd" d="M6.22 3.22a.75.75 0 0 1 1.06 0l4.25 4.25a.75.75 0 0 1 0 1.06l-4.25 4.25a.75.75 0 1 1-1.06-1.06L9.94 8 6.22 4.28a.75.75 0 0 1 0-1.06z"/>
@@ -50,7 +51,7 @@
       </div>
     </div>
 
-    {#if !repositoryCollapseStore.isCollapsed(repoKey, $repositoryCollapseStore)}
+    {#if !isCollapsed}
       {#if workflowRuns?.length > 0}
         <div class="divide-y divide-[#21262d]">
           {#each workflowRuns as run, index (index)}

src/features/actions/RepositoryCard.svelte

@@ -5,7 +5,7 @@
 
   let { org, repo, isLoaded, workflowRuns = [], filterHint = '' } = $props();
 
-  const repoKey = `${org}/${repo}`;
+  const repoKey = $derived(`${org}/${repo}`);
 
   function toggleCollapse() {
     repositoryCollapseStore.toggle(repoKey);

src/features/config/ConfigList.svelte

@@ -121,7 +121,7 @@
   {/if}
 
   {#if editingIndex === -1}
-    <button class="flex items-center {$isMobile ? 'p-2 px-3' : 'p-3 px-4'} glass-container hover:border-[#388bfd44] w-full mb-4 transition-all duration-200" onclick={() => (editingIndex = -2)}>
+    <button class="flex items-center {$isMobile ? 'p-2 px-3' : 'p-3 px-4'} glass-container hover:border-[#388bfd44] w-full mb-4 transition-all duration-200" onclick={() => (editingIndex = -2)} aria-label="Add configuration">
       <span class="text-xl mr-1 text-[#3fb950]">+</span>
       <span>Add Repository</span>
     </button>

src/features/config/LabelFilter.svelte

@@ -99,7 +99,7 @@
       {#each filters as filter, i (i)}
         <span class="chip">
           {getDisplayName(filter)}
-          <button type="button" onclick={() => onRemove(filter)} aria-label="Remove {filter} filter">×</button>
+          <button type="button" onclick={() => onRemove(filter)} aria-label={`Remove ${filter} filter`}>×</button>
         </span>
       {/each}
     </div>
@@ -153,7 +153,7 @@
   {#if loading}
     <p class="text-xs text-[#8b949e] mt-1">Loading {title.toLowerCase()}...</p>
   {:else if noOptionsAvailable}
-    <button type="button" class="text-xs text-[#58a6ff] mt-1 hover:underline" onclick={onLoadOptions}>
+    <button type="button" class="text-xs text-[#58a6ff] mt-1 hover:underline" onclick={onLoadOptions} aria-label={`Load ${title} options`}>
       Refresh {title.toLowerCase()} list
     </button>
   {/if}

src/features/config/OrganizationManager.svelte

@@ -62,7 +62,7 @@
             <button
               class="text-[#8b949e] hover:text-[#f85149] transition-colors duration-200 cursor-pointer flex items-center justify-center w-6 h-6"
               title="Remove organization"
-              aria-label="delete {org.name}"
+              aria-label={`Delete ${org.name}`}
               onclick={() => deleteOrganization(i)}
             >
               <img src={deleteSVG} alt="Delete" width="14" height="14" />

src/features/config/directives/useDraggable.test.ts

@@ -1,4 +1,5 @@
 import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
+import type { Mock } from 'vitest';
 import { useDraggable } from './useDraggable';
 
 // Mock console methods to avoid clutter during tests
@@ -9,7 +10,7 @@ vi.mock('console', () => ({
 
 describe('useDraggable', () => {
   let container: HTMLElement;
-  let mockOnReorder: ReturnType<typeof vi.fn>;
+  let mockOnReorder: Mock<(fromIndex: number, toIndex: number) => void>;
   let directive: ReturnType<typeof useDraggable>;
 
   beforeEach(() => {
@@ -23,7 +24,7 @@ describe('useDraggable', () => {
     document.body.appendChild(container);
 
     // Mock the onReorder callback
-    mockOnReorder = vi.fn();
+    mockOnReorder = vi.fn<(fromIndex: number, toIndex: number) => void>();
 
     // Initialize the directive
     directive = useDraggable(container, { onReorder: mockOnReorder });

src/features/config/directives/useDraggable.ts

@@ -36,7 +36,7 @@ export const useDraggable: Action<HTMLElement, DraggableOptions> = (node, option
   const SCROLL_SPEED = 30; // Pixels per frame for auto-scroll (increased from 15)
   const SCROLL_INTERVAL = 16; // Milliseconds between scroll updates (60fps)
 
-  function findScrollContainer(element: HTMLElement): HTMLElement | null {
+  function findScrollContainer(_element: HTMLElement): HTMLElement | null {
     // For auto-scroll, we always want to use window scrolling when the list is long
     // So we'll return document.body to indicate we should use window.scrollBy
     return document.body;
@@ -199,7 +199,7 @@ export const useDraggable: Action<HTMLElement, DraggableOptions> = (node, option
   }
 
   // Add wheel event listener to stop auto-scroll when user manually scrolls
-  function handleWheel(event: WheelEvent): void {
+  function handleWheel(_event: WheelEvent): void {
     if (state.isDragging) {
       stopAutoScroll();
       // Don't prevent default to allow manual scrolling
@@ -208,7 +208,7 @@ export const useDraggable: Action<HTMLElement, DraggableOptions> = (node, option
   }
 
   // Add touch event listeners for mobile scrolling
-  function handleTouchStart(event: TouchEvent): void {
+  function handleTouchStart(_event: TouchEvent): void {
     if (state.isDragging) {
       stopAutoScroll();
       // Don't prevent default to allow manual scrolling

src/features/config/services/config-page.service.ts

@@ -1,4 +1,4 @@
-import { derived, type Readable, get } from 'svelte/store';
+import { derived, type Readable } from 'svelte/store';
 import { eventBus } from '$shared/stores/event-bus.store';
 import { configService } from '$features/config/services/config.service';
 import { repositoryFacade } from '$shared/stores/repository.facade';
@@ -83,7 +83,7 @@ export class ConfigPageService {
   }
 
   getErrorMessage(): Readable<string | null> {
-    return derived(eventBus, ($eventBus) => {
+    return derived(eventBus, (_eventBus) => {
       // This would be enhanced with actual error handling
       return null;
     });
@@ -103,7 +103,7 @@ export class ConfigPageService {
       // Clear loading state on error
       eventBus.set('');
 
-      const errorResult = errorService.handleError(error, {
+      errorService.handleError(error, {
         component: 'ConfigPageService',
         action: 'loadConfigurations',
       });
@@ -130,7 +130,7 @@ export class ConfigPageService {
       // Clear save state on error
       eventBus.set('');
 
-      const errorResult = errorService.handleError(error, {
+      errorService.handleError(error, {
         component: 'ConfigPageService',
         action: 'saveConfigurations',
       });
@@ -147,7 +147,7 @@ export class ConfigPageService {
     try {
       const validation = configService.validateConfigurations(configs);
       return validation.isValid;
-    } catch (error) {
+    } catch (_error) {
       return false;
     }
   }

src/features/config/services/config.service.ts

@@ -1,5 +1,4 @@
 import { captureException } from '$integrations/sentry';
-import { eventBus } from '$shared/stores/event-bus.store';
 import { killSwitch } from '$shared/stores/kill-switch.store';
 import { repositoryFacade } from '$shared/stores/repository.facade';
 import { get } from 'svelte/store';

src/features/config/services/repository-search.service.test.ts

@@ -32,7 +32,7 @@ describe('RepositorySearchService', () => {
 
       mockSearchRepositories.mockResolvedValue(mockResults);
 
-      let stateUpdates: any[] = [];
+      const stateUpdates: any[] = [];
       const onStateUpdate = (updates: any) => {
         stateUpdates.push(updates);
       };
@@ -65,7 +65,7 @@ describe('RepositorySearchService', () => {
 
       mockSearchRepositories.mockResolvedValue(mockResults);
 
-      let stateUpdates: any[] = [];
+      const stateUpdates: any[] = [];
       const onStateUpdate = (updates: any) => {
         stateUpdates.push(updates);
       };
@@ -135,7 +135,7 @@ describe('RepositorySearchService', () => {
       const repoName = 'repo';
       const existingRepos = [];
 
-      let stateUpdates: any[] = [];
+      const stateUpdates: any[] = [];
       const onStateUpdate = (updates: any) => {
         stateUpdates.push(updates);
       };
@@ -158,7 +158,7 @@ describe('RepositorySearchService', () => {
 
       mockSearchRepositories.mockRejectedValue(new Error('API Error'));
 
-      let stateUpdates: any[] = [];
+      const stateUpdates: any[] = [];
       const onStateUpdate = (updates: any) => {
         stateUpdates.push(updates);
       };