Rework folder structure in frontend

Pages are now grouped per group they appear in on in the header (where possible)
Utilities used by multiple pages in the project are grouped in folders such as services/pipes/etc

frontend/src/app/app.component.ts

@@ -1,8 +1,8 @@
 import {Component, OnInit} from '@angular/core';
 import {Meta, Title} from '@angular/platform-browser';
-import {ALTITUDE_VERSION} from './constant';
+import {ALTITUDE_VERSION} from '@custom-types/constant';
 import {Router, RouterOutlet} from '@angular/router';
-import {FooterComponent} from './footer/footer.component';
+import {FooterComponent} from '@pages/footer/footer/footer.component';
 
 @Component({
   standalone: true,
@@ -10,8 +10,8 @@ import {FooterComponent} from './footer/footer.component';
   templateUrl: './app.component.html',
   styleUrl: './app.component.scss',
   imports: [
-    FooterComponent,
-    RouterOutlet
+    RouterOutlet,
+    FooterComponent
   ]
 })
 export class AppComponent implements OnInit {

frontend/src/app/app.routes.ts

@@ -3,114 +3,110 @@ import {Routes} from '@angular/router';
 export const routes: Routes = [
   {
     path: '',
-    loadComponent: () => import('./home/home.component').then(m => m.HomeComponent)
+    loadComponent: () => import('./pages/home/home.component').then(m => m.HomeComponent)
   },
   {
     path: 'particles',
-    loadComponent: () => import('./particles/particles.component').then(m => m.ParticlesComponent)
+    loadComponent: () => import('./pages/particles/particles.component').then(m => m.ParticlesComponent)
   },
   {
     path: 'map',
-    loadComponent: () => import('./map/map.component').then(m => m.MapComponent)
+    loadComponent: () => import('./pages/features/map/map.component').then(m => m.MapComponent)
   },
   {
     path: 'rules',
-    loadComponent: () => import('./rules/rules.component').then(m => m.RulesComponent)
+    loadComponent: () => import('./pages/reference/rules/rules.component').then(m => m.RulesComponent)
   },
   {
     path: 'vote',
-    loadComponent: () => import('./vote/vote.component').then(m => m.VoteComponent)
+    loadComponent: () => import('./pages/vote/vote.component').then(m => m.VoteComponent)
   },
   {
     path: 'about',
-    loadComponent: () => import('./about/about.component').then(m => m.AboutComponent)
+    loadComponent: () => import('./pages/altitude/about/about.component').then(m => m.AboutComponent)
   },
   {
     path: 'socials',
-    loadComponent: () => import('./socials/socials.component').then(m => m.SocialsComponent)
+    loadComponent: () => import('./pages/altitude/socials/socials.component').then(m => m.SocialsComponent)
   },
   {
     path: 'team',
-    loadComponent: () => import('./team/team.component').then(m => m.TeamComponent)
+    loadComponent: () => import('./pages/altitude/team/team.component').then(m => m.TeamComponent)
   },
   {
     path: 'birthdays',
-    loadComponent: () => import('./birthdays/birthdays.component').then(m => m.BirthdaysComponent)
+    loadComponent: () => import('./pages/altitude/birthdays/birthdays.component').then(m => m.BirthdaysComponent)
   },
   {
     path: 'terms',
-    loadComponent: () => import('./terms/terms.component').then(m => m.TermsComponent)
+    loadComponent: () => import('./pages/footer/terms/terms.component').then(m => m.TermsComponent)
   },
   {
     path: 'privacy',
-    loadComponent: () => import('./privacy/privacy.component').then(m => m.PrivacyComponent)
+    loadComponent: () => import('./pages/footer/privacy/privacy.component').then(m => m.PrivacyComponent)
   },
   {
     path: 'bans',
-    loadComponent: () => import('./bans/bans.component').then(m => m.BansComponent)
+    loadComponent: () => import('./pages/reference/bans/bans.component').then(m => m.BansComponent)
   },
   {
     path: 'bans/:type/:id',
-    loadComponent: () => import('./bans/details/details.component').then(m => m.DetailsComponent)
+    loadComponent: () => import('./pages/reference/bans/details/details.component').then(m => m.DetailsComponent)
   },
   {
     path: 'economy',
-    loadComponent: () => import('./economy/economy.component').then(m => m.EconomyComponent)
+    loadComponent: () => import('./pages/features/economy/economy.component').then(m => m.EconomyComponent)
   },
   {
     path: 'claiming',
-    loadComponent: () => import('./claiming/claiming.component').then(m => m.ClaimingComponent)
+    loadComponent: () => import('./pages/features/claiming/claiming.component').then(m => m.ClaimingComponent)
   },
   {
     path: 'mypet',
-    loadComponent: () => import('./mypet/mypet.component').then(m => m.MypetComponent)
+    loadComponent: () => import('./pages/features/mypet/mypet.component').then(m => m.MypetComponent)
   },
   {
     path: 'warps',
-    loadComponent: () => import('./warps/warps.component').then(m => m.WarpsComponent)
+    loadComponent: () => import('./pages/features/warps/warps.component').then(m => m.WarpsComponent)
   },
   {
     path: 'skyblock',
-    loadComponent: () => import('./skyblock/skyblock.component').then(m => m.SkyblockComponent)
+    loadComponent: () => import('./pages/features/skyblock/skyblock.component').then(m => m.SkyblockComponent)
   },
   {
     path: 'customfeatures',
-    loadComponent: () => import('./customfeatures/customfeatures.component').then(m => m.CustomfeaturesComponent)
+    loadComponent: () => import('./pages/features/customfeatures/customfeatures.component').then(m => m.CustomfeaturesComponent)
   },
   {
     path: 'guide',
-    loadComponent: () => import('./guide/guide.component').then(m => m.GuideComponent)
+    loadComponent: () => import('./pages/reference/guide/guide.component').then(m => m.GuideComponent)
   },
   {
     path: 'ranks',
-    loadComponent: () => import('./ranks/ranks.component').then(m => m.RanksComponent)
+    loadComponent: () => import('./pages/reference/ranks/ranks.component').then(m => m.RanksComponent)
   },
   {
     path: 'commandlist',
-    loadComponent: () => import('./commandlist/commandlist.component').then(m => m.CommandlistComponent)
+    loadComponent: () => import('./pages/reference/commandlist/commandlist.component').then(m => m.CommandlistComponent)
   },
   {
     path: 'mapart',
-    loadComponent: () => import('./mapart/mapart.component').then(m => m.MapartComponent)
+    loadComponent: () => import('./pages/reference/mapart/mapart.component').then(m => m.MapartComponent)
   },
   {
     path: 'lag',
-    loadComponent: () => import('./lag/lag.component').then(m => m.LagComponent)
+    loadComponent: () => import('./pages/reference/lag/lag.component').then(m => m.LagComponent)
   },
   {
     path: 'staffpowers',
-    loadComponent: () => import('./staffpowers/staffpowers.component').then(m => m.StaffpowersComponent)
+    loadComponent: () => import('./pages/reference/staffpowers/staffpowers.component').then(m => m.StaffpowersComponent)
   },
   {
     path: 'forms/:form',
-    loadComponent: () => import('./forms/forms.component').then(m => m.FormsComponent)
+    loadComponent: () => import('./pages/forms/forms.component').then(m => m.FormsComponent)
   },
   {
     path: 'forms',
-    loadComponent: () => import('./forms/forms.component').then(m => m.FormsComponent)
-  },
-  {
-    path: 'login',
-    loadComponent: () => import('./login/login.component').then(m => m.LoginDialogComponent)
-  },
+    loadComponent: () => import('./pages/forms/forms.component').then(m => m.FormsComponent)
+  }
 ];

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

@@ -1,7 +1,7 @@
 import {Component} from '@angular/core';
-import {ScrollService} from '../scroll/scroll.service';
+import {ScrollService} from '@services/scroll.service';
 import {CommonModule} from '@angular/common';
-import {HeaderComponent} from '../header/header.component';
+import {HeaderComponent} from '@header/header.component';
 
 @Component({
   selector: 'app-about',

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

@@ -1,7 +1,7 @@
 import {Component} from '@angular/core';
-import {ScrollService} from '../scroll/scroll.service';
+import {ScrollService} from '@services/scroll.service';
 import {CommonModule} from '@angular/common';
-import {HeaderComponent} from '../header/header.component';
+import {HeaderComponent} from '@header/header.component';
 
 @Component({
   selector: 'app-birthdays',

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

@@ -1,7 +1,7 @@
 import {Component} from '@angular/core';
-import {ScrollService} from '../scroll/scroll.service';
+import {ScrollService} from '@services/scroll.service';
 import {CommonModule, NgOptimizedImage} from '@angular/common';
-import {HeaderComponent} from '../header/header.component';
+import {HeaderComponent} from '@header/header.component';
 
 @Component({
   selector: 'app-socials',

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

@@ -1,11 +1,11 @@
 import {Component} from '@angular/core';
-import {ScrollService} from '../scroll/scroll.service';
-import {BASE_PATH, Player, TeamService} from '../../api';
+import {ScrollService} from '@services/scroll.service';
+import {BASE_PATH, Player, TeamService} from '@api';
 import {CommonModule, NgOptimizedImage} from '@angular/common';
-import {HeaderComponent} from '../header/header.component';
+import {HeaderComponent} from '@header/header.component';
 import {CookieService} from 'ngx-cookie-service';
 import {map, Observable, shareReplay} from 'rxjs';
-import {environment} from '../../environments/environment';
+import {environment} from '@environment';
 
 @Component({
   selector: 'app-team',

frontend/src/app/pages/features/claiming/claiming.component.ts

@@ -1,5 +1,5 @@
 import {Component} from '@angular/core';
-import {HeaderComponent} from '../header/header.component';
+import {HeaderComponent} from '@header/header.component';
 import {NgOptimizedImage} from '@angular/common';
 import {RouterLink} from '@angular/router';
 

frontend/src/app/pages/features/customfeatures/customfeatures.component.ts

@@ -1,5 +1,5 @@
 import {Component} from '@angular/core';
-import {HeaderComponent} from "../header/header.component";
+import {HeaderComponent} from "@header/header.component";
 import {RouterLink} from '@angular/router';
 
 @Component({

frontend/src/app/pages/features/economy/economy.component.ts

@@ -1,5 +1,5 @@
 import {Component} from '@angular/core';
-import {HeaderComponent} from '../header/header.component';
+import {HeaderComponent} from '@header/header.component';
 import {NgOptimizedImage} from '@angular/common';
 
 @Component({

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

@@ -1,6 +1,6 @@
 import {Component} from '@angular/core';
 import {CommonModule} from '@angular/common';
-import {HeaderComponent} from '../header/header.component';
+import {HeaderComponent} from '@header/header.component';
 
 @Component({
   standalone: true,

frontend/src/app/pages/features/mypet/mypet.component.ts

@@ -1,5 +1,5 @@
 import {Component} from '@angular/core';
-import {HeaderComponent} from '../header/header.component';
+import {HeaderComponent} from '@header/header.component';
 import {NgOptimizedImage} from '@angular/common';
 
 @Component({

frontend/src/app/pages/features/skyblock/skyblock.component.ts

@@ -1,5 +1,5 @@
 import {Component} from '@angular/core';
-import {HeaderComponent} from '../header/header.component';
+import {HeaderComponent} from '@header/header.component';
 
 @Component({
   selector: 'app-skyblock',

frontend/src/app/pages/features/warps/warps.component.ts

@@ -1,5 +1,5 @@
 import {Component} from '@angular/core';
-import {HeaderComponent} from '../header/header.component';
+import {HeaderComponent} from '@header/header.component';
 import {NgOptimizedImage} from '@angular/common';
 import {RouterLink} from '@angular/router';
 

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

@@ -1,5 +1,5 @@
 import {Component} from '@angular/core';
-import {ALTITUDE_VERSION} from '../constant';
+import {ALTITUDE_VERSION} from '@custom-types/constant';
 import {CommonModule, NgOptimizedImage} from '@angular/common';
 import {RouterLink} from '@angular/router';
 

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

@@ -1,7 +1,7 @@
 import {Component} from '@angular/core';
-import {ScrollService} from '../scroll/scroll.service';
+import {ScrollService} from '@services/scroll.service';
 import {CommonModule} from '@angular/common';
-import {HeaderComponent} from '../header/header.component';
+import {HeaderComponent} from '@header/header.component';
 import {RouterLink} from '@angular/router';
 
 @Component({

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

@@ -1,6 +1,6 @@
 import {Component} from '@angular/core';
-import {ScrollService} from '../scroll/scroll.service';
-import {HeaderComponent} from '../header/header.component';
+import {ScrollService} from '@services/scroll.service';
+import {HeaderComponent} from '@header/header.component';
 import {CommonModule} from '@angular/common';
 import {RouterLink} from '@angular/router';
 

frontend/src/app/pages/forms/appeal/appeal.component.ts

@@ -1,7 +1,7 @@
 import {Component, OnInit} from '@angular/core';
 import {FormsComponent} from '../forms.component';
 import {FormControl, FormGroup, Validators} from '@angular/forms';
-import {AppealsService, MinecraftAppeal} from '../../../api';
+import {AppealsService, MinecraftAppeal} from '@api';
 
 @Component({
   selector: 'app-appeal',

frontend/src/app/pages/forms/forms.component.ts

@@ -1,12 +1,12 @@
 import {Component, Input, OnInit} from '@angular/core';
-import {HeaderComponent} from '../header/header.component';
+import {HeaderComponent} from '@header/header.component';
 import {MatDialog} from '@angular/material/dialog';
 import {ActivatedRoute} from '@angular/router';
-import {LoginDialogComponent} from '../login/login.component';
+import {LoginDialogComponent} from '@shared-components/login/login.component';
 import {KeyValuePipe, NgForOf, NgIf} from '@angular/common';
 import {FormType} from './form_type';
 import {MatButton} from '@angular/material/button';
-import {AuthService} from '../services/auth.service';
+import {AuthService} from '@services/auth.service';
 
 @Component({
   selector: 'app-forms',

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

@@ -1,6 +1,6 @@
 import {Component, HostListener, Input} from '@angular/core';
 import {CommonModule, NgOptimizedImage} from '@angular/common';
-import {ThemeComponent} from '../theme/theme.component';
+import {ThemeComponent} from '@shared-components/theme/theme.component';
 import {RouterLink} from '@angular/router';
 
 @Component({

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

@@ -1,10 +1,10 @@
 import {Component, OnInit} from '@angular/core';
 import {Title} from '@angular/platform-browser';
-import {ALTITUDE_VERSION} from '../constant';
-import {ScrollService} from '../scroll/scroll.service';
+import {ALTITUDE_VERSION} from '@custom-types/constant';
+import {ScrollService} from '@services/scroll.service';
 import {CommonModule, NgOptimizedImage} from '@angular/common';
-import {HeaderComponent} from '../header/header.component';
-import {CopyIpComponent} from '../copy-ip/copy-ip.component';
+import {HeaderComponent} from '@header/header.component';
+import {CopyIpComponent} from '@shared-components/copy-ip/copy-ip.component';
 import {RouterLink} from '@angular/router';
 
 @Component({

frontend/src/app/pages/particles/particles.component.ts

@@ -10,7 +10,7 @@ import {MatCheckboxModule} from '@angular/material/checkbox';
 import {MatTabsModule} from '@angular/material/tabs';
 import {MatCardModule} from '@angular/material/card';
 import {MatIconModule} from '@angular/material/icon';
-import {HeaderComponent} from '../header/header.component';
+import {HeaderComponent} from '@header/header.component';
 
 // Services
 import {IntersectionPlaneService} from './services/intersection-plane.service';
@@ -22,7 +22,7 @@ import {ParticleComponent} from './components/particle/particle.component';
 import {FramesComponent} from './components/frames/frames.component';
 import {MatSnackBar} from '@angular/material/snack-bar';
 import {RenderContainerComponent} from './components/render-container/render-container.component';
-import {ParticlesService} from '../../api';
+import {ParticlesService} from '@api';
 
 @Component({
   selector: 'app-particles',