fixing #149 missing seats paging (#151)

* fixing #149 missing seats paging

Signed-off-by: Piotr Karpala <[email protected]>

* 2.0.1

Signed-off-by: Piotr Karpala <[email protected]>

* vitest 2.1.9

* fix test and dockerfile

* logs

* error handling

---------

Signed-off-by: Piotr Karpala <[email protected]>

Author: karpikpl

DEPLOYMENT.md

@@ -150,7 +150,7 @@ or navigate using UI:
 
 1. Set a unique name.
 2. Provide a home page URL: your company URL or just `http://localhost`.
-3. Add a callback URL for `http://localhost:3000/github/auth`. (We'll add the real redirect URL after the application is deployed.)
+3. Add a callback URL for `http://localhost:3000/auth/github`. (We'll add the real redirect URL after the application is deployed.)
 4. Uncheck the "Webhook -> Active" checkbox.
 5. Set the scopes:
    - Select **Organization permissions**.

Dockerfile

@@ -36,12 +36,17 @@ RUN echo '#!/bin/sh' > /entrypoint.sh && \
     echo 'export NUXT_PUBLIC_GITHUB_ENT=${NUXT_PUBLIC_GITHUB_ENT:-$VUE_APP_GITHUB_ENT}' >> /entrypoint.sh && \
     echo 'export NUXT_PUBLIC_GITHUB_TEAM=${NUXT_PUBLIC_GITHUB_TEAM:-$VUE_APP_GITHUB_TEAM}' >> /entrypoint.sh && \
     echo 'export NUXT_GITHUB_TOKEN=${NUXT_GITHUB_TOKEN:-$VUE_APP_GITHUB_TOKEN}' >> /entrypoint.sh && \
-    echo 'export NUXT_SESSION_PASSWORD=${NUXT_SESSION_PASSWORD:-$SESSION_SECRET}' >> /entrypoint.sh && \
+    echo 'export NUXT_SESSION_PASSWORD=${NUXT_SESSION_PASSWORD:-$SESSION_SECRET$SESSION_SECRET$SESSION_SECRET$SESSION_SECRET}' >> /entrypoint.sh && \
     echo 'export NUXT_OAUTH_GITHUB_CLIENT_ID=${NUXT_OAUTH_GITHUB_CLIENT_ID:-$GITHUB_CLIENT_ID}' >> /entrypoint.sh && \
     echo 'export NUXT_OAUTH_GITHUB_CLIENT_SECRET=${NUXT_OAUTH_GITHUB_CLIENT_SECRET:-$GITHUB_CLIENT_SECRET}' >> /entrypoint.sh && \
+    # Conditionally set NUXT_PUBLIC_USING_GITHUB_AUTH if GITHUB_CLIENT_ID is provided
+    echo 'if [ -n "$GITHUB_CLIENT_ID" ]; then' >> /entrypoint.sh && \
+    echo 'export NUXT_PUBLIC_USING_GITHUB_AUTH=true' >> /entrypoint.sh && \
+    echo 'fi' >> /entrypoint.sh && \
     echo 'node /app/server/index.mjs' >> /entrypoint.sh && \
     chmod +x /entrypoint.sh
 
+
 USER node
 ENTRYPOINT [ "/entrypoint.sh" ]
 

app/components/MainComponent.vue

@@ -60,11 +60,13 @@
             <BreakdownComponent v-if="item === 'editors'" :metrics="metrics" :breakdown-key="'editor'" />
             <CopilotChatViewer v-if="item === 'copilot chat'" :metrics="metrics" />
             <SeatsAnalysisViewer v-if="item === 'seat analysis'" :seats="seats" />
-            <ApiResponse v-if="item === 'api response'" :metrics="metrics" :original-metrics="originalMetrics"
+            <ApiResponse
+v-if="item === 'api response'" :metrics="metrics" :original-metrics="originalMetrics"
               :seats="seats" />
           </v-card>
         </v-window-item>
-        <v-alert v-show="metricsReady && metrics.length == 0" density="compact" text="No data available to display"
+        <v-alert
+v-show="metricsReady && metrics.length == 0" density="compact" text="No data available to display"
           title="No data" type="warning" />
       </v-window>
 
@@ -148,12 +150,13 @@ export default defineNuxtComponent({
             break;
           case 404:
             apiError.value = `404 Not Found - is the ${config.public.scope || ''} org:'${config.public.githubOrg || ''} ent:'${config.public.githubEnt || ''}' team:'${config.public.githubTeam}' correct? ${error.message}`;
-            // Update apiError with the error message
-            apiError.value = error.message;
             break;
           case 500:
             apiError.value = `500 Internal Server Error - most likely a bug in the app. Error: ${error.message}`;
             break;
+          default:
+            apiError.value = `${error.statusCode} Error: ${error.message}`;
+            break;
         }
       }
     }

e2e-tests/copilot.ent.spec.ts

@@ -1,7 +1,5 @@
 import { expect, test } from '@playwright/test'
 import { DashboardPage } from './pages/DashboardPage';
-import { aw } from 'vitest/dist/chunks/reporters.D7Jzd9GS.js';
-import { a } from 'vitest/dist/chunks/suite.B2jumIFP.js';
 
 const tag = { tag: ['@ent'] }
 

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "copilot-metrics-viewer",
-  "version": "2.0.0",
+  "version": "2.0.1",
   "private": true,
   "type": "module",
   "scripts": {
@@ -40,7 +40,7 @@
     "playwright-core": "^1.49.1",
     "sass-embedded": "^1.80.3",
     "typescript": "^5.6.3",
-    "vitest": "^2.1.8",
+    "vitest": "^2.1.9",
     "vue-tsc": "^2.1.6",
     "vuetify-nuxt-module": "^0.18.3"
   }

package.json

@@ -1,15 +1,16 @@
 import type { CopilotMetrics } from "@/model/Copilot_Metrics";
 import { convertToMetrics } from '@/model/MetricsToUsageConverter';
 import type { MetricsApiResponse } from "@/types/metricsApiResponse";
+import type FetchError from 'ofetch';
 
 // TODO: use for storage https://unstorage.unjs.io/drivers/azure
 
 import { readFileSync } from 'fs';
 import { resolve } from 'path';
 
-
 export default defineEventHandler(async (event) => {
 
+    const logger = console;
     const config = useRuntimeConfig(event);
     let apiUrl = '';
     let mockedDataPath: string;
@@ -34,31 +35,39 @@ export default defineEventHandler(async (event) => {
     }
 
     if (config.public.isDataMocked && mockedDataPath) {
-        // console.log('getting mocked metrics data from:', mockedDataPath);
         const path = mockedDataPath;
         const data = readFileSync(path, 'utf8');
         const dataJson = JSON.parse(data);
         // usage is the new API format
         const usageData = ensureCopilotMetrics(dataJson);
         // metrics is the old API format
         const metricsData = convertToMetrics(usageData);
+
+        logger.info('Using mocked data');
         return { metrics: metricsData, usage: usageData } as MetricsApiResponse;
     }
 
     if (!event.context.headers.has('Authorization')) {
+        logger.error('No Authentication provided');
         return new Response('No Authentication provided', { status: 401 });
     }
 
-    // console.log('getting metrics data from:', apiUrl);
-    const response = await $fetch(apiUrl, {
-        headers: event.context.headers
-    }) as unknown[];
+    logger.info(`Fetching metrics data from ${apiUrl}`);
 
-    // usage is the new API format
-    const usageData = ensureCopilotMetrics(response as CopilotMetrics[]);
-    // metrics is the old API format
-    const metricsData = convertToMetrics(usageData);
-    return { metrics: metricsData, usage: usageData } as MetricsApiResponse;
+    try {
+        const response = await $fetch(apiUrl, {
+            headers: event.context.headers
+        }) as unknown[];
+
+        // usage is the new API format
+        const usageData = ensureCopilotMetrics(response as CopilotMetrics[]);
+        // metrics is the old API format
+        const metricsData = convertToMetrics(usageData);
+        return { metrics: metricsData, usage: usageData } as MetricsApiResponse;
+    } catch (error: FetchError) {
+        logger.error('Error fetching metrics data:', error);
+        return new Response('Error fetching metrics data: ' + error, { status: error.statusCode || 500 });
+    }
 })
 
 function ensureCopilotMetrics(data: CopilotMetrics[]): CopilotMetrics[] {