Remove AppModule and enhance Team and Header components

Deleted unused `AppModule` to streamline the project structure. Enhanced the `TeamComponent` by integrating team member data from the API and updating its template. Improved the `HeaderComponent` by adding `priority` to the logo image for better performance.

frontend/build.gradle.kts

@@ -0,0 +1,14 @@
+tasks.register<Exec>("npmInstall") {
+  commandLine("npm.cmd", "install")
+//    commandLine("npm", "install")
+}
+
+tasks.register<Exec>("ngBuild") {
+  dependsOn("npmInstall", "generateFrontendApi")
+//    commandLine("npm", "run", "build")
+  commandLine("npm.cmd", "run", "build")
+}
+
+//dependencies {
+//  implementation(project(":backend"))
+//}

frontend/src/app/about/about.component.ts

@@ -1,9 +1,15 @@
 import {Component} from '@angular/core';
 import {ScrollService} from '../scroll/scroll.service';
+import {CommonModule} from '@angular/common';
+import {HeaderComponent} from '../header/header.component';
 
 @Component({
   selector: 'app-about',
-  standalone: false,
+  standalone: true,
+  imports: [
+    CommonModule,
+    HeaderComponent
+  ],
   templateUrl: './about.component.html',
   styleUrl: './about.component.scss'
 })

frontend/src/app/app.component.ts

@@ -1,13 +1,18 @@
 import {Component, OnInit} from '@angular/core';
 import {Meta, Title} from '@angular/platform-browser';
 import {ALTITUDE_VERSION} from './constant';
-import {Router} from '@angular/router';
+import {Router, RouterOutlet} from '@angular/router';
+import {FooterComponent} from './footer/footer.component';
 
 @Component({
-  standalone: false,
+  standalone: true,
   selector: 'app-root',
   templateUrl: './app.component.html',
   styleUrl: './app.component.scss',
+  imports: [
+    FooterComponent,
+    RouterOutlet
+  ]
 })
 export class AppComponent implements OnInit {
   title = 'Survival Minecraft Server on ' + ALTITUDE_VERSION + '! | Altitude Community';

frontend/src/app/app.module.ts

@@ -1,64 +0,0 @@
-import {NgModule} from '@angular/core';
-import {BrowserModule} from '@angular/platform-browser';
-import {AppComponent} from './app.component';
-import {RouterModule, Routes} from '@angular/router';
-import {HeaderComponent} from './header/header.component';
-import {HomeComponent} from './home/home.component';
-import {NgOptimizedImage} from '@angular/common';
-import {ThemeComponent} from "./theme/theme.component";
-import {CookieService} from 'ngx-cookie-service';
-import {MapComponent} from './map/map.component';
-import {RulesComponent} from './rules/rules.component';
-import {CopyIpComponent} from './copy-ip/copy-ip.component';
-import {FooterComponent} from './footer/footer.component';
-import {TermsComponent} from './terms/terms.component';
-import {PrivacyComponent} from './privacy/privacy.component';
-import {TeamComponent} from './team/team.component';
-import {AboutComponent} from './about/about.component';
-import {SocialsComponent} from './socials/socials.component';
-import {VoteComponent} from './vote/vote.component';
-import {BirthdaysComponent} from './birthdays/birthdays.component';
-
-const routes: Routes = [
-  {path: '', component: HomeComponent},
-  {path: 'map', component: MapComponent},
-  {path: 'rules', component: RulesComponent},
-  {path: 'vote', component: VoteComponent},
-  {path: 'about', component: AboutComponent},
-  {path: 'socials', component: SocialsComponent},
-  {path: 'team', component: TeamComponent},
-  {path: 'birthdays', component: BirthdaysComponent},
-  {path: 'terms', component: TermsComponent},
-  {path: 'privacy', component: PrivacyComponent},
-];
-
-@NgModule({
-  declarations: [
-    AppComponent,
-    HeaderComponent,
-    FooterComponent,
-    ThemeComponent,
-    HomeComponent,
-    MapComponent,
-    RulesComponent,
-    VoteComponent,
-    AboutComponent,
-    SocialsComponent,
-    TeamComponent,
-    BirthdaysComponent,
-    TermsComponent,
-    PrivacyComponent,
-  ],
-  imports: [
-    BrowserModule,
-    RouterModule.forRoot(routes, {
-      scrollPositionRestoration: 'enabled',
-    }),
-    NgOptimizedImage,
-    CopyIpComponent,
-  ],
-  providers: [CookieService],
-  bootstrap: [AppComponent]
-})
-export class AppModule {
-}

frontend/src/app/app.routes.ts

@@ -1,3 +1,46 @@
 import {Routes} from '@angular/router';
 
-export const routes: Routes = [];
+export const routes: Routes = [
+  {
+    path: '',
+    loadComponent: () => import('./home/home.component').then(m => m.HomeComponent)
+  },
+  {
+    path: 'map',
+    loadComponent: () => import('./map/map.component').then(m => m.MapComponent)
+  },
+  {
+    path: 'rules',
+    loadComponent: () => import('./rules/rules.component').then(m => m.RulesComponent)
+  },
+  {
+    path: 'vote',
+    loadComponent: () => import('./vote/vote.component').then(m => m.VoteComponent)
+  },
+  {
+    path: 'about',
+    loadComponent: () => import('./about/about.component').then(m => m.AboutComponent)
+  },
+  {
+    path: 'socials',
+    loadComponent: () => import('./socials/socials.component').then(m => m.SocialsComponent)
+  },
+  {
+    path: 'team',
+    loadComponent: () => import('./team/team.component').then(m => m.TeamComponent)
+  },
+  {
+    path: 'birthdays',
+    loadComponent: () => import('./birthdays/birthdays.component').then(m => m.BirthdaysComponent)
+  },
+  {
+    path: 'terms',
+    loadComponent: () => import('./terms/terms.component').then(m => m.TermsComponent)
+  },
+  {
+    path: 'privacy',
+    loadComponent: () => import('./privacy/privacy.component').then(m => m.PrivacyComponent)
+  }
+];
+
+

frontend/src/app/birthdays/birthdays.component.ts

@@ -1,9 +1,15 @@
 import {Component} from '@angular/core';
 import {ScrollService} from '../scroll/scroll.service';
+import {CommonModule} from '@angular/common';
+import {HeaderComponent} from '../header/header.component';
 
 @Component({
   selector: 'app-birthdays',
-  standalone: false,
+  standalone: true,
+  imports: [
+    CommonModule,
+    HeaderComponent
+  ],
   templateUrl: './birthdays.component.html',
   styleUrl: './birthdays.component.scss'
 })

frontend/src/app/copy-ip/copy-ip.component.ts

@@ -1,8 +1,13 @@
 import {Component} from '@angular/core';
+import {CommonModule} from '@angular/common';
 
 @Component({
   selector: 'app-copy-ip',
   templateUrl: './copy-ip.component.html',
+  standalone: true,
+  imports: [
+    CommonModule
+  ],
   styleUrl: './copy-ip.component.scss'
 })
 export class CopyIpComponent {

frontend/src/app/footer/footer.component.ts

@@ -1,9 +1,16 @@
 import {Component} from '@angular/core';
 import {ALTITUDE_VERSION} from '../constant';
+import {CommonModule, NgOptimizedImage} from '@angular/common';
+import {RouterLink} from '@angular/router';
 
 @Component({
   selector: 'app-footer',
-  standalone: false,
+  standalone: true,
+  imports: [
+    CommonModule,
+    RouterLink,
+    NgOptimizedImage
+  ],
   templateUrl: './footer.component.html',
   styleUrl: './footer.component.scss'
 })

frontend/src/app/header/header.component.html

@@ -64,7 +64,8 @@
             </ul>
           </div>
         </div>
-        <a href="/"><img ngSrc="/public/img/logos/logo.png" alt="Altitude Server Logo" height="319" width="550"></a>
+        <a href="/"><img ngSrc="/public/img/logos/logo.png" priority alt="Altitude Server Logo" height="319"
+                         width="550"></a>
         <ul id="nav_list">
           <li class="nav_li"><a [id]="getCurrentPageId(['home'])" class="nav_link" href="/" [ngClass]="active">Home</a>
           </li>

frontend/src/app/header/header.component.ts

@@ -1,7 +1,16 @@
 import {Component, HostListener, Input} from '@angular/core';
+import {CommonModule, NgOptimizedImage} from '@angular/common';
+import {ThemeComponent} from '../theme/theme.component';
+import {RouterLink} from '@angular/router';
 
 @Component({
-  standalone: false,
+  standalone: true,
+  imports: [
+    CommonModule,
+    ThemeComponent,
+    RouterLink,
+    NgOptimizedImage
+  ],
   selector: 'app-header',
   templateUrl: './header.component.html',
   styleUrls: ['./header.component.scss']

frontend/src/app/home/home.component.ts

@@ -2,9 +2,20 @@ import {Component, OnInit} from '@angular/core';
 import {Title} from '@angular/platform-browser';
 import {ALTITUDE_VERSION} from '../constant';
 import {ScrollService} from '../scroll/scroll.service';
+import {CommonModule, NgOptimizedImage} from '@angular/common';
+import {HeaderComponent} from '../header/header.component';
+import {CopyIpComponent} from '../copy-ip/copy-ip.component';
+import {RouterLink} from '@angular/router';
 
 @Component({
-  standalone: false,
+  standalone: true,
+  imports: [
+    CommonModule,
+    HeaderComponent,
+    CopyIpComponent,
+    RouterLink,
+    NgOptimizedImage
+  ],
   selector: 'app-home',
   templateUrl: './home.component.html',
   styleUrl: './home.component.scss'

frontend/src/app/map/map.component.ts

@@ -1,7 +1,13 @@
 import {Component} from '@angular/core';
+import {CommonModule} from '@angular/common';
+import {HeaderComponent} from '../header/header.component';
 
 @Component({
-  standalone: false,
+  standalone: true,
+  imports: [
+    CommonModule,
+    HeaderComponent
+  ],
   selector: 'app-map',
   templateUrl: './map.component.html',
   styleUrl: './map.component.scss'

frontend/src/app/privacy/privacy.component.ts

@@ -1,9 +1,17 @@
 import {Component} from '@angular/core';
 import {ScrollService} from '../scroll/scroll.service';
+import {CommonModule} from '@angular/common';
+import {HeaderComponent} from '../header/header.component';
+import {RouterLink} from '@angular/router';
 
 @Component({
   selector: 'app-privacy',
-  standalone: false,
+  standalone: true,
+  imports: [
+    CommonModule,
+    HeaderComponent,
+    RouterLink
+  ],
   templateUrl: './privacy.component.html',
   styleUrl: './privacy.component.scss'
 })

frontend/src/app/rules/rules.component.ts

@@ -1,8 +1,16 @@
 import {Component} from '@angular/core';
 import {ScrollService} from '../scroll/scroll.service';
+import {CommonModule} from '@angular/common';
+import {HeaderComponent} from '../header/header.component';
+import {RouterLink} from '@angular/router';
 
 @Component({
-  standalone: false,
+  standalone: true,
+  imports: [
+    CommonModule,
+    HeaderComponent,
+    RouterLink
+  ],
   selector: 'app-rules',
   templateUrl: './rules.component.html',
   styleUrl: './rules.component.scss'

frontend/src/app/socials/socials.component.html

@@ -9,27 +9,37 @@
   <main>
     <section class="darkmodeSection">
       <div class="socialContainer" style="padding-top: 50px;">
-        <a href="https://discord.com/invite/alttd"><img class="socialIcon" ngSrc="/public/img/logos/discordsocial.png"
+        <a href="https://discord.com/invite/alttd">
+          <img class="socialIcon" ngSrc="/public/img/logos/discordsocial.png"
                title="discord.gg/alttd" alt="Altitude Discord" height="150"
-                                                        width="150" style="width: 150px;"></a>
+               width="150" style="width: 150px;">
-        <a href="https://www.tiktok.com/@alttdmc"><img class="socialIcon" ngSrc="/public/img/logos/tiktoksocial.png"
+        </a>
+        <a href="https://www.tiktok.com/@alttdmc">
+          <img class="socialIcon" ngSrc="/public/img/logos/tiktoksocial.png"
                title="alttdmc" alt="Altitude TikTok" height="150" width="150"
-                                                       style="width: 150px;"></a>
+               style="width: 150px;">
+        </a>
       </div>
       <div class="socialContainer">
-        <a href="https://www.instagram.com/alttdmc/"><img class="socialIcon"
+        <a href="https://www.instagram.com/alttdmc/">
+          <img class="socialIcon"
                ngSrc="/public/img/logos/instagramsocial.png"
                title="alttdmc" alt="Altitude Instagram" height="150"
-                                                          width="150" style="width: 150px;"></a>
+               width="150" style="width: 150px;">
-        <a href="https://twitter.com/alttdmc"><img class="socialIcon" ngSrc="/public/img/logos/twittersocial.png"
+        </a>
+        <a href="https://twitter.com/alttdmc">
+          <img class="socialIcon" ngSrc="/public/img/logos/twittersocial.png"
                title="alttdmc" alt="Altitude Twitter. Yes, Twitter. Not X."
                height="150" width="150"
-                                                   style="width: 150px;"></a>
+               style="width: 150px;">
+        </a>
       </div>
       <div class="socialContainer" style="padding-bottom: 50px;">
-        <a href="https://www.youtube.com/c/alttd"><img class="socialIcon" ngSrc="/public/img/logos/youtubesocial.png"
+        <a href="https://www.youtube.com/c/alttd">
+          <img class="socialIcon" ngSrc="/public/img/logos/youtubesocial.png"
                title="Altitude Community" alt="Altitude YouTube" height="150"
-                                                       width="150" style="width: 150px;"></a>
+               width="150" style="width: 150px;">
+        </a>
       </div>
     </section>
   </main>

frontend/src/app/socials/socials.component.ts

@@ -1,9 +1,16 @@
 import {Component} from '@angular/core';
 import {ScrollService} from '../scroll/scroll.service';
+import {CommonModule, NgOptimizedImage} from '@angular/common';
+import {HeaderComponent} from '../header/header.component';
 
 @Component({
   selector: 'app-socials',
-  standalone: false,
+  standalone: true,
+  imports: [
+    CommonModule,
+    HeaderComponent,
+    NgOptimizedImage
+  ],
   templateUrl: './socials.component.html',
   styleUrl: './socials.component.scss'
 })

frontend/src/app/team/team.component.html

@@ -17,6 +17,7 @@
                alt="akastijn's Minecraft skin" height="160" width="160" style="width: 160px;">
           <h2>akastijn</h2>
           <p>Owner</p>
+          <p>{{ members }}</p>
         </div>
         <div class="member">
           <img ngSrc="https://crafatar.com/avatars/0b06c1b9ae5845d5af60731e4c788dc8?overlay"

frontend/src/app/team/team.component.ts

@@ -1,13 +1,35 @@
 import {Component} from '@angular/core';
 import {ScrollService} from '../scroll/scroll.service';
+import {BASE_PATH, TeamMember, TeamService} from '../../api';
+import {CommonModule, NgOptimizedImage} from '@angular/common';
+import {HeaderComponent} from '../header/header.component';
+import {CookieService} from 'ngx-cookie-service';
 
 @Component({
   selector: 'app-team',
-  standalone: false,
+  standalone: true,
+  imports: [
+    CommonModule,
+    HeaderComponent,
+    NgOptimizedImage
+  ],
+  providers: [
+    CookieService,
+    {provide: BASE_PATH, useValue: 'http://localhost:8080/'}
+  ],
+
   templateUrl: './team.component.html',
   styleUrl: './team.component.scss'
 })
 export class TeamComponent {
-  constructor(public scrollService: ScrollService) {
+  public members: TeamMember[] = [];
+
+  constructor(public scrollService: ScrollService, public teamApi: TeamService) {
+    console.log("TeamComponent")
+    teamApi.getTeamMembers("test").subscribe(res => {
+      console.log(res)
+      console.log("AHH")
+      this.members = res;
+    });
   }
 }

frontend/src/app/terms/terms.component.ts

@@ -1,10 +1,18 @@
 import {Component} from '@angular/core';
 import {ScrollService} from '../scroll/scroll.service';
+import {HeaderComponent} from '../header/header.component';
+import {CommonModule} from '@angular/common';
+import {RouterLink} from '@angular/router';
 
 @Component({
   selector: 'app-terms',
-  standalone: false,
+  standalone: true,
   templateUrl: './terms.component.html',
+  imports: [
+    CommonModule,
+    HeaderComponent,
+    RouterLink
+  ],
   styleUrl: './terms.component.scss'
 })
 export class TermsComponent {

frontend/src/app/theme/theme.component.ts

@@ -2,9 +2,13 @@ import {Component, OnDestroy, OnInit} from '@angular/core';
 import {Subscription} from 'rxjs';
 import {ThemeService} from './theme.service';
 import {THEME_MODE} from '../constant';
+import {CommonModule} from '@angular/common';
 
 @Component({
-  standalone: false,
+  standalone: true,
+  imports: [
+    CommonModule,
+  ],
   selector: 'app-theme',
   templateUrl: './theme.component.html',
   styleUrl: './theme.component.scss'

frontend/src/app/vote/vote.component.ts

@@ -1,9 +1,15 @@
 import {Component} from '@angular/core';
 import {ScrollService} from '../scroll/scroll.service';
+import {CommonModule} from '@angular/common';
+import {HeaderComponent} from '../header/header.component';
 
 @Component({
   selector: 'app-vote',
-  standalone: false,
+  standalone: true,
+  imports: [
+    CommonModule,
+    HeaderComponent
+  ],
   templateUrl: './vote.component.html',
   styleUrl: './vote.component.scss'
 })

frontend/src/main.ts

@@ -1,6 +1,16 @@
-import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';
+import {bootstrapApplication} from '@angular/platform-browser';
-import {AppModule} from './app/app.module';
+import {AppComponent} from './app/app.component';
+import {provideRouter} from '@angular/router';
+import {routes} from './app/app.routes';
+import {provideHttpClient} from '@angular/common/http';
+import {BASE_PATH} from './api';
+
+
+bootstrapApplication(AppComponent, {
+  providers: [
+    provideRouter(routes),
+    provideHttpClient(),
+    {provide: BASE_PATH, useValue: 'http://localhost:8080'}
+  ]
+}).catch(err => console.error(err));
 
-platformBrowserDynamic()
-  .bootstrapModule(AppModule)
-  .catch((err) => console.error(err));