From efcd332fe5ce80f4ae59d95d52d4a1095780c75c Mon Sep 17 00:00:00 2001
From: "Felix T.J. Dietrich" <felix_dietrich@gmx.de>
Date: Mon, 14 Oct 2024 19:13:00 +0200
Subject: [PATCH] fix minor issues

---
 webapp/src/app/home/home.component.html       |  2 +-
 .../leaderboard/filter/filter.component.html  |  4 +-
 .../leaderboard/filter/filter.component.ts    |  3 +-
 .../home/leaderboard/filter/filter.stories.ts | 40 +++++++++++++++++--
 .../filter/repository/repository.component.ts | 16 +-------
 .../filter/repository/repository.stories.ts   |  2 +-
 6 files changed, 44 insertions(+), 23 deletions(-)

diff --git a/webapp/src/app/home/home.component.html b/webapp/src/app/home/home.component.html
index 534696f9..19787091 100644
--- a/webapp/src/app/home/home.component.html
+++ b/webapp/src/app/home/home.component.html
@@ -8,7 +8,7 @@ <h1 class="text-3xl font-bold">Artemis Leaderboard</h1>
             <h2 class="text-xl text-muted-foreground">Hi {{ userValue.name }} 👋</h2>
           }
         </div>
-        <app-leaderboard-filter [metaData]="metaQuery.data()" />
+        <app-leaderboard-filter [repositories]="metaQuery.data()?.repositoriesToMonitor" />
       </div>
       <div class="col-span-2">
         @if (query.error()) {
diff --git a/webapp/src/app/home/leaderboard/filter/filter.component.html b/webapp/src/app/home/leaderboard/filter/filter.component.html
index 3fa36028..6ece45f4 100644
--- a/webapp/src/app/home/leaderboard/filter/filter.component.html
+++ b/webapp/src/app/home/leaderboard/filter/filter.component.html
@@ -5,6 +5,8 @@ <h3 class="text-base font-semibold tracking-wide">Filter</h3>
   </span>
   <form ngForm class="flex xl:flex-col gap-4">
     <app-leaderboard-filter-timeframe />
-    <app-leaderboard-filter-repository [repositories]="metaData()?.repositoriesToMonitor" />
+    @if (repositories() && repositories()!.length > 1) {
+      <app-leaderboard-filter-repository [repositories]="repositories()!" />
+    }
   </form>
 </div>
diff --git a/webapp/src/app/home/leaderboard/filter/filter.component.ts b/webapp/src/app/home/leaderboard/filter/filter.component.ts
index 8d8e8d2f..b4d4cb72 100644
--- a/webapp/src/app/home/leaderboard/filter/filter.component.ts
+++ b/webapp/src/app/home/leaderboard/filter/filter.component.ts
@@ -3,7 +3,6 @@ import { FormsModule } from '@angular/forms';
 import { ListFilter, LucideAngularModule } from 'lucide-angular';
 import { LeaderboardFilterTimeframeComponent } from './timeframe/timeframe.component';
 import { LeaderboardFilterRepositoryComponent } from './repository/repository.component';
-import { MetaDataDTO } from '@app/core/modules/openapi';
 
 @Component({
   selector: 'app-leaderboard-filter',
@@ -14,5 +13,5 @@ import { MetaDataDTO } from '@app/core/modules/openapi';
 export class LeaderboardFilterComponent {
   protected ListFilter = ListFilter;
 
-  metaData = input<MetaDataDTO>();
+  repositories = input<string[]>();
 }
diff --git a/webapp/src/app/home/leaderboard/filter/filter.stories.ts b/webapp/src/app/home/leaderboard/filter/filter.stories.ts
index f2ebf26e..5b6df996 100644
--- a/webapp/src/app/home/leaderboard/filter/filter.stories.ts
+++ b/webapp/src/app/home/leaderboard/filter/filter.stories.ts
@@ -1,16 +1,48 @@
-import { type Meta, type StoryObj } from '@storybook/angular';
+import { argsToTemplate, type Meta, type StoryObj } from '@storybook/angular';
 import { LeaderboardFilterComponent } from './filter.component';
 
 const meta: Meta<LeaderboardFilterComponent> = {
   component: LeaderboardFilterComponent,
-  tags: ['autodocs']
+  tags: ['autodocs'],
+  args: {
+    repositories: [
+      'ls1intum/Artemis',
+      'ls1intum/Athena',
+      'ls1intum/Hephaestus',
+      'ls1intum/Pyris',
+      'ls1intum/Ares2',
+      'ls1intum/Aeolus',
+      'ls1intum/hades',
+      'ls1intum/Apollon',
+      'ls1intum/Apollon_standalone'
+    ]
+  },
+  argTypes: {
+    repositories: {
+      control: {
+        type: 'object'
+      },
+      description: 'List of repositories'
+    }
+  }
 };
 
 export default meta;
 type Story = StoryObj<LeaderboardFilterComponent>;
 
 export const Default: Story = {
-  render: () => ({
-    template: '<app-leaderboard-filter />'
+  render: (args) => ({
+    props: args,
+    template: `<app-leaderboard-filter ${argsToTemplate(args)} />`
+  })
+};
+
+export const SingleRepository: Story = {
+  args: {
+    repositories: ['ls1intum/Artemis']
+  },
+  render: (args) => ({
+    props: args,
+    template: `<app-leaderboard-filter ${argsToTemplate(args)} />`
   })
 };
diff --git a/webapp/src/app/home/leaderboard/filter/repository/repository.component.ts b/webapp/src/app/home/leaderboard/filter/repository/repository.component.ts
index ebdbb638..a9a3c7ae 100644
--- a/webapp/src/app/home/leaderboard/filter/repository/repository.component.ts
+++ b/webapp/src/app/home/leaderboard/filter/repository/repository.component.ts
@@ -5,18 +5,6 @@ import { BrnSelectModule } from '@spartan-ng/ui-select-brain';
 import { HlmSelectModule } from '@spartan-ng/ui-select-helm';
 import { HlmLabelModule } from '@spartan-ng/ui-label-helm';
 
-export const repositoryNames = [
-  'ls1intum/Artemis',
-  'ls1intum/Athena',
-  'ls1intum/Hephaestus',
-  'ls1intum/Pyris',
-  'ls1intum/Ares2',
-  'ls1intum/Aeolus',
-  'ls1intum/hades',
-  'ls1intum/Apollon',
-  'ls1intum/Apollon_standalone'
-];
-
 interface SelectOption {
   id: number;
   value: string;
@@ -30,11 +18,11 @@ interface SelectOption {
   templateUrl: './repository.component.html'
 })
 export class LeaderboardFilterRepositoryComponent {
-  repositories = input<string[]>();
+  repositories = input.required<string[]>();
   value = signal<string>('');
 
   placeholder = computed(() => {
-    return repositoryNames.find((option) => option === this.value()) ?? 'All';
+    return this.repositories().find((option) => option === this.value()) ?? 'All';
   });
 
   options = computed(() => {
diff --git a/webapp/src/app/home/leaderboard/filter/repository/repository.stories.ts b/webapp/src/app/home/leaderboard/filter/repository/repository.stories.ts
index 08c173c7..0fd723d7 100644
--- a/webapp/src/app/home/leaderboard/filter/repository/repository.stories.ts
+++ b/webapp/src/app/home/leaderboard/filter/repository/repository.stories.ts
@@ -19,7 +19,7 @@ type Story = StoryObj<LeaderboardFilterRepositoryComponent>;
 
 export const Default: Story = {
   args: {
-    repositories: ['ls1intum/Artemis']
+    repositories: ['ls1intum/Artemis', 'ls1intum/Athena', 'ls1intum/Hephaestus']
   },
   render: (args) => ({
     props: args,