feat/frontend: optimizing imports, file extensions (#230)

Co-authored-by: FifthWit <fifthwitbusiness@gmail.com>

43 files changed, 132 insertions, 134 deletions

diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index c6952b1..e4bde75 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -1,22 +1,22 @@
 import React from 'react';
 import { Routes, Route } from "react-router-dom";
 
-import { UserProfile } from './types/Profile';
+import { UserProfile } from '@customTypes/Profile';
 import Sidebar from './components/Sidebar';
 import "./App.css";
 
-import Profile from './pages/Profile';
-import Games from './pages/Games';
-import Maps from './pages/Maps';
-import User from './pages/User';
-import Homepage from './pages/Homepage';
+import Profile from '@pages/Profile';
+import Games from '@pages/Games';
+import Maps from '@pages/Maps';
+import User from '@pages/User';
+import Homepage from '@pages/Homepage';
 import UploadRunDialog from './components/UploadRunDialog';
-import Rules from './pages/Rules';
-import About from './pages/About';
-import { Game } from './types/Game';
+import Rules from '@pages/Rules';
+import About from '@pages/About';
+import { Game } from '@customTypes/Game';
 import { API } from './api/Api';
-import Maplist from './pages/Maplist';
-import Rankings from './pages/Rankings';
+import Maplist from '@pages/Maplist';
+import Rankings from '@pages/Rankings';
 import { get_user_id_from_token, get_user_mod_from_token } from './utils/Jwt';
 
 const App: React.FC = () => {
diff --git a/frontend/src/api/Api.tsx b/frontend/src/api/Api.ts
index 053e920..2e55ab4 100644
--- a/frontend/src/api/Api.tsx
+++ b/frontend/src/api/Api.ts
@@ -1,11 +1,11 @@
-import { MapDiscussionCommentContent, MapDiscussionContent, ModMenuContent } from '../types/Content';
-import { delete_token, get_token } from './Auth';
-import { get_user, get_profile, post_profile } from './User';
-import { get_games, get_chapters, get_games_chapters, get_game_maps, get_search } from './Games';
-import { get_official_rankings, get_unofficial_rankings } from './Rankings';
-import { get_map_summary, get_map_leaderboard, get_map_discussions, get_map_discussion, post_map_discussion, post_map_discussion_comment, delete_map_discussion, post_record, delete_map_record } from './Maps';
-import { delete_map_summary, post_map_summary, put_map_image, put_map_summary } from './Mod';
-import { UploadRunContent } from '../types/Content';
+import { MapDiscussionCommentContent, MapDiscussionContent, ModMenuContent } from '@customTypes/Content';
+import { delete_token, get_token } from '@api/Auth';
+import { get_user, get_profile, post_profile } from '@api/User';
+import { get_games, get_chapters, get_games_chapters, get_game_maps, get_search } from '@api/Games';
+import { get_official_rankings, get_unofficial_rankings } from '@api/Rankings';
+import { get_map_summary, get_map_leaderboard, get_map_discussions, get_map_discussion, post_map_discussion, post_map_discussion_comment, delete_map_discussion, post_record, delete_map_record } from '@api/Maps';
+import { delete_map_summary, post_map_summary, put_map_image, put_map_summary } from '@api/Mod';
+import { UploadRunContent } from '@customTypes/Content';
 
 // add new api call function entries here
 // example usage: API.get_games();
diff --git a/frontend/src/api/Auth.tsx b/frontend/src/api/Auth.ts
index 09269e6..875c7e5 100644
--- a/frontend/src/api/Auth.tsx
+++ b/frontend/src/api/Auth.ts
@@ -1,5 +1,5 @@
 import axios from "axios";
-import { url } from "./Api";
+import { url } from "@api/Api";
 
 export const get_token = async (): Promise<string | undefined> => {
   const response = await axios.get(url(`token`))
diff --git a/frontend/src/api/Games.tsx b/frontend/src/api/Games.ts
index 84b5f74..72bb4b3 100644
--- a/frontend/src/api/Games.tsx
+++ b/frontend/src/api/Games.ts
@@ -1,9 +1,9 @@
 import axios from "axios";
-import { url } from "./Api";
-import { GameChapter, GamesChapters } from "../types/Chapters";
-import { Game } from "../types/Game";
-import { Map } from "../types/Map";
-import { Search } from "../types/Search";
+import { url } from "@api/Api";
+import { GameChapter, GamesChapters } from "@customTypes/Chapters";
+import { Game } from "@customTypes/Game";
+import { Map } from "@customTypes/Map";
+import { Search } from "@customTypes/Search";
 
 export const get_games = async (): Promise<Game[]> => {
   const response = await axios.get(url(`games`))
diff --git a/frontend/src/api/Maps.tsx b/frontend/src/api/Maps.ts
index fc50293..89657b5 100644
--- a/frontend/src/api/Maps.tsx
+++ b/frontend/src/api/Maps.ts
@@ -1,7 +1,7 @@
 import axios from "axios";
-import { url } from "./Api";
-import { MapDiscussionContent, UploadRunContent } from "../types/Content";
-import { MapSummary, MapLeaderboard, MapDiscussions, MapDiscussion } from "../types/Map";
+import { url } from "@api/Api";
+import { MapDiscussionContent, UploadRunContent } from "@customTypes/Content";
+import { MapSummary, MapLeaderboard, MapDiscussions, MapDiscussion } from "@customTypes/Map";
 
 export const get_map_summary = async (map_id: string): Promise<MapSummary> => {
   const response = await axios.get(url(`maps/${map_id}/summary`))
diff --git a/frontend/src/api/Mod.tsx b/frontend/src/api/Mod.ts
index 9091379..1511f8b 100644
--- a/frontend/src/api/Mod.tsx
+++ b/frontend/src/api/Mod.ts
@@ -1,6 +1,6 @@
 import axios from "axios";
-import { url } from "./Api";
-import { ModMenuContent } from "../types/Content";
+import { url } from "@api/Api";
+import { ModMenuContent } from "@customTypes/Content";
 
 export const put_map_image = async (token: string, map_id: string, image: string): Promise<boolean> => {
   const response = await axios.put(url(`maps/${map_id}/image`), {
diff --git a/frontend/src/api/Rankings.tsx b/frontend/src/api/Rankings.ts
index 384f826..b8d9bec 100644
--- a/frontend/src/api/Rankings.tsx
+++ b/frontend/src/api/Rankings.ts
@@ -1,6 +1,6 @@
 import axios from "axios";
-import { url } from "./Api";
-import { Ranking, SteamRanking } from "../types/Ranking";
+import { url } from "@api/Api";
+import { Ranking, SteamRanking } from "@customTypes/Ranking";
 
 export const get_official_rankings = async (): Promise<Ranking> => {
   const response = await axios.get(url(`rankings/lphub`));
diff --git a/frontend/src/api/User.tsx b/frontend/src/api/User.ts
index c4d1944..88da0f2 100644
--- a/frontend/src/api/User.tsx
+++ b/frontend/src/api/User.ts
@@ -1,6 +1,6 @@
 import axios from "axios";
-import { url } from "./Api";
-import { UserProfile } from "../types/Profile";
+import { url } from "@api/Api";
+import { UserProfile } from "@customTypes/Profile";
 
 export const get_user = async (user_id: string): Promise<UserProfile> => {
   const response = await axios.get(url(`users/${user_id}`));
diff --git a/frontend/src/components/ConfirmDialog.tsx b/frontend/src/components/ConfirmDialog.tsx
index c4299fd..44a653b 100644
--- a/frontend/src/components/ConfirmDialog.tsx
+++ b/frontend/src/components/ConfirmDialog.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 
-import "../css/Dialog.css"
+import "@css/Dialog.css"
 
 interface ConfirmDialogProps {
     title: string;
diff --git a/frontend/src/components/Discussions.tsx b/frontend/src/components/Discussions.tsx
index 0522910..17ae586 100644
--- a/frontend/src/components/Discussions.tsx
+++ b/frontend/src/components/Discussions.tsx
@@ -1,12 +1,12 @@
 import React from 'react';
 
-import { MapDiscussion, MapDiscussions, MapDiscussionsDetail } from '../types/Map';
-import { MapDiscussionCommentContent, MapDiscussionContent } from '../types/Content';
-import { time_ago } from '../utils/Time';
-import { API } from '../api/Api';
-import "../css/Maps.css"
+import { MapDiscussion, MapDiscussions, MapDiscussionsDetail } from '@customTypes/Map';
+import { MapDiscussionCommentContent, MapDiscussionContent } from '@customTypes/Content';
+import { time_ago } from '@utils/Time';
+import { API } from '@api/Api';
+import "@css/Maps.css"
 import { Link } from 'react-router-dom';
-import useConfirm from '../hooks/UseConfirm';
+import useConfirm from '@hooks/UseConfirm';
 
 interface DiscussionsProps {
   token?: string
diff --git a/frontend/src/components/GameCategory.tsx b/frontend/src/components/GameCategory.tsx
index 3291e09..d8879ef 100644
--- a/frontend/src/components/GameCategory.tsx
+++ b/frontend/src/components/GameCategory.tsx
@@ -1,8 +1,8 @@
 import React from 'react';
 import { Link } from "react-router-dom";
 
-import { Game, GameCategoryPortals } from '../types/Game';
-import "../css/Games.css"
+import { Game, GameCategoryPortals } from '@customTypes/Game';
+import "@css/Games.css"
 
 interface GameCategoryProps {
     game: Game;
diff --git a/frontend/src/components/GameEntry.tsx b/frontend/src/components/GameEntry.tsx
index ced40ee..3bd2842 100644
--- a/frontend/src/components/GameEntry.tsx
+++ b/frontend/src/components/GameEntry.tsx
@@ -1,10 +1,10 @@
 import React from 'react';
 import { Link } from "react-router-dom";
 
-import { Game, GameCategoryPortals } from '../types/Game';
-import "../css/Games.css"
+import { Game, GameCategoryPortals } from '@customTypes/Game';
+import "@css/Games.css"
 
-import GameCategory from './GameCategory';
+import GameCategory from '@components/GameCategory';
 
 interface GameEntryProps {
   game: Game;
diff --git a/frontend/src/components/Leaderboards.tsx b/frontend/src/components/Leaderboards.tsx
index aaaee62..4a8b463 100644
--- a/frontend/src/components/Leaderboards.tsx
+++ b/frontend/src/components/Leaderboards.tsx
@@ -1,11 +1,11 @@
 import React from 'react';
 import { Link } from 'react-router-dom';
 
-import { DownloadIcon, ThreedotIcon } from '../images/Images';
-import { MapLeaderboard } from '../types/Map';
-import { ticks_to_time, time_ago } from '../utils/Time';
-import useMessage from "../hooks/UseMessage";
-import "../css/Maps.css"
+import { DownloadIcon, ThreedotIcon } from '@images/Images';
+import { MapLeaderboard } from '@customTypes/Map';
+import { ticks_to_time, time_ago } from '@utils/Time';
+import useMessage from "@hooks/UseMessage";
+import "@css/Maps.css"
 
 interface LeaderboardsProps {
   data?: MapLeaderboard;
diff --git a/frontend/src/components/Login.tsx b/frontend/src/components/Login.tsx
index 545f724..f1628b2 100644
--- a/frontend/src/components/Login.tsx
+++ b/frontend/src/components/Login.tsx
@@ -1,10 +1,10 @@
 import React from 'react';
 import { Link, useNavigate } from 'react-router-dom';
 
-import { ExitIcon, UserIcon, LoginIcon } from '../images/Images';
-import { UserProfile } from '../types/Profile';
-import { API } from '../api/Api';
-import "../css/Login.css";
+import { ExitIcon, UserIcon, LoginIcon } from '@images/Images';
+import { UserProfile } from '@customTypes/Profile';
+import { API } from '@api/Api';
+import "@css/Login.css";
 
 interface LoginProps {
   setToken: React.Dispatch<React.SetStateAction<string | undefined>>;
diff --git a/frontend/src/components/MessageDialog.tsx b/frontend/src/components/MessageDialog.tsx
index 17b1258..5c85189 100644
--- a/frontend/src/components/MessageDialog.tsx
+++ b/frontend/src/components/MessageDialog.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 
-import "../css/Dialog.css"
+import "@css/Dialog.css"
 
 interface MessageDialogProps {
     title: string;
diff --git a/frontend/src/components/MessageDialogLoad.tsx b/frontend/src/components/MessageDialogLoad.tsx
index 381a4a4..966e064 100644
--- a/frontend/src/components/MessageDialogLoad.tsx
+++ b/frontend/src/components/MessageDialogLoad.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 
-import "../css/Dialog.css"
+import "@css/Dialog.css"
 
 interface MessageDialogLoadProps {
     title: string;    
diff --git a/frontend/src/components/ModMenu.tsx b/frontend/src/components/ModMenu.tsx
index 2fb1737..925b8a8 100644
--- a/frontend/src/components/ModMenu.tsx
+++ b/frontend/src/components/ModMenu.tsx
@@ -2,11 +2,11 @@ import React from 'react';
 import ReactMarkdown from 'react-markdown';
 import { useNavigate } from 'react-router-dom';
 
-import { MapSummary } from '../types/Map';
-import { ModMenuContent } from '../types/Content';
-import { API } from '../api/Api';
-import "../css/ModMenu.css"
-import useConfirm from '../hooks/UseConfirm';
+import { MapSummary } from '@customTypes/Map';
+import { ModMenuContent } from '@customTypes/Content';
+import { API } from '@api/Api';
+import "@css/ModMenu.css"
+import useConfirm from '@hooks/UseConfirm';
 
 interface ModMenuProps {
   token?: string;
diff --git a/frontend/src/components/RankingEntry.tsx b/frontend/src/components/RankingEntry.tsx
index 25b0201..b899965 100644
--- a/frontend/src/components/RankingEntry.tsx
+++ b/frontend/src/components/RankingEntry.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import { Link } from "react-router-dom";
-import { RankingType, SteamRanking, SteamRankingType } from '../types/Ranking';
+import { RankingType, SteamRanking, SteamRankingType } from '@customTypes/Ranking';
 
 enum RankingCategories {
     rankings_overall,
diff --git a/frontend/src/components/Sidebar.tsx b/frontend/src/components/Sidebar.tsx
index 5757183..67f7f3d 100644
--- a/frontend/src/components/Sidebar.tsx
+++ b/frontend/src/components/Sidebar.tsx
@@ -1,12 +1,12 @@
 import React from 'react';
 import { Link, useLocation } from 'react-router-dom';
 
-import { BookIcon, FlagIcon, HelpIcon, HomeIcon, LogoIcon, PortalIcon, SearchIcon, UploadIcon } from '../images/Images';
-import Login from './Login';
-import { UserProfile } from '../types/Profile';
-import { Search } from '../types/Search';
-import { API } from '../api/Api';
-import "../css/Sidebar.css";
+import { BookIcon, FlagIcon, HelpIcon, HomeIcon, LogoIcon, PortalIcon, SearchIcon, UploadIcon } from '@images/Images';
+import Login from '@components/Login';
+import { UserProfile } from '@customTypes/Profile';
+import { Search } from '@customTypes/Search';
+import { API } from '@api/Api';
+import "@css/Sidebar.css";
 
 interface SidebarProps {
   setToken: React.Dispatch<React.SetStateAction<string | undefined>>;
diff --git a/frontend/src/components/Summary.tsx b/frontend/src/components/Summary.tsx
index 79e989f..14b02ac 100644
--- a/frontend/src/components/Summary.tsx
+++ b/frontend/src/components/Summary.tsx
@@ -1,8 +1,8 @@
 import React from 'react';
 import ReactMarkdown from 'react-markdown';
 
-import { MapSummary } from '../types/Map';
-import "../css/Maps.css"
+import { MapSummary } from '@customTypes/Map';
+import "@css/Maps.css"
 
 interface SummaryProps {
   selectedRun: number
diff --git a/frontend/src/components/UploadRunDialog.tsx b/frontend/src/components/UploadRunDialog.tsx
index 0610377..118b589 100644
--- a/frontend/src/components/UploadRunDialog.tsx
+++ b/frontend/src/components/UploadRunDialog.tsx
@@ -1,15 +1,15 @@
 import React from 'react';
-import { UploadRunContent } from '../types/Content';
+import { UploadRunContent } from '@customTypes/Content';
 import { ScoreboardTempUpdate, SourceDemoParser, NetMessages } from '@nekz/sdp';
 
-import '../css/UploadRunDialog.css';
-import { Game } from '../types/Game';
-import { Map } from '../types/Map';
-import { API } from '../api/Api';
+import '@css/UploadRunDialog.css';
+import { Game } from '@customTypes/Game';
+import { Map } from '@customTypes/Map';
+import { API } from '@api/Api';
 import { useNavigate } from 'react-router-dom';
-import useMessage from '../hooks/UseMessage';
-import useConfirm from '../hooks/UseConfirm';
-import useMessageLoad from "../hooks/UseMessageLoad";
+import useMessage from '@hooks/UseMessage';
+import useConfirm from '@hooks/UseConfirm';
+import useMessageLoad from "@hooks/UseMessageLoad";
 
 interface UploadRunDialogProps {
   token?: string;
diff --git a/frontend/src/hooks/UseConfirm.tsx b/frontend/src/hooks/UseConfirm.tsx
index 0d64224..e86d70d 100644
--- a/frontend/src/hooks/UseConfirm.tsx
+++ b/frontend/src/hooks/UseConfirm.tsx
@@ -1,5 +1,5 @@
 import React, { useState } from 'react';
-import ConfirmDialog from '../components/ConfirmDialog';
+import ConfirmDialog from '@components/ConfirmDialog';
 
 const useConfirm = () => {
     const [isOpen, setIsOpen] = useState(false);
diff --git a/frontend/src/hooks/UseMessage.tsx b/frontend/src/hooks/UseMessage.tsx
index 13d8e4f..97ec746 100644
--- a/frontend/src/hooks/UseMessage.tsx
+++ b/frontend/src/hooks/UseMessage.tsx
@@ -1,5 +1,5 @@
 import React, { useState } from 'react';
-import MessageDialog from "../components/MessageDialog";
+import MessageDialog from "@components/MessageDialog";
 
 const useMessage = () => {
     const [isOpen, setIsOpen] = useState(false);
diff --git a/frontend/src/hooks/UseMessageLoad.tsx b/frontend/src/hooks/UseMessageLoad.tsx
index defd2b3..228c2b4 100644
--- a/frontend/src/hooks/UseMessageLoad.tsx
+++ b/frontend/src/hooks/UseMessageLoad.tsx
@@ -1,5 +1,5 @@
 import React, { useState } from 'react';
-import MessageDialogLoad from "../components/MessageDialogLoad";
+import MessageDialogLoad from "@components/MessageDialogLoad";
 
 const useMessageLoad = () => {
     const [isOpen, setIsOpen] = useState(false);
diff --git a/frontend/src/pages/About.tsx b/frontend/src/pages/About.tsx
index c0883eb..ded3461 100644
--- a/frontend/src/pages/About.tsx
+++ b/frontend/src/pages/About.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import ReactMarkdown from 'react-markdown';
 
-import '../css/About.css';
+import '@css/About.css';
 
 const About: React.FC = () => {
 
diff --git a/frontend/src/pages/Games.tsx b/frontend/src/pages/Games.tsx
index ea136c2..15105c9 100644
--- a/frontend/src/pages/Games.tsx
+++ b/frontend/src/pages/Games.tsx
@@ -1,8 +1,8 @@
 import React from 'react';
 
-import GameEntry from '../components/GameEntry';
-import { Game } from '../types/Game';
-import "../css/Maps.css"
+import GameEntry from '@components/GameEntry';
+import { Game } from '@customTypes/Game';
+import "@css/Maps.css"
 
 interface GamesProps {
     games: Game[];
diff --git a/frontend/src/pages/Homepage.tsx b/frontend/src/pages/Homepage.tsx
index 8c1cd48..68562b6 100644
--- a/frontend/src/pages/Homepage.tsx
+++ b/frontend/src/pages/Homepage.tsx
@@ -1,5 +1,4 @@
 import React from 'react';
-import { PortalIcon } from '../images/Images';
 
 const Homepage: React.FC = () => {
 
diff --git a/frontend/src/pages/Maplist.tsx b/frontend/src/pages/Maplist.tsx
index 4c1c172..8fc52b0 100644
--- a/frontend/src/pages/Maplist.tsx
+++ b/frontend/src/pages/Maplist.tsx
@@ -1,11 +1,10 @@
 import React, { useEffect } from "react";
 import { Link, useLocation, useNavigate, useParams } from "react-router-dom";
 
-import "../css/Maplist.css";
-import { API } from "../api/Api";
-import { Game, GameChapters } from "../types/Game";
-import { GameChapter, GamesChapters } from "../types/Chapters";
-import { Map } from "../types/Map";
+import "@css/Maplist.css";
+import { API } from "@api/Api";
+import { Game } from "@customTypes/Game";
+import { GameChapter, GamesChapters } from "@customTypes/Chapters";
 
 const Maplist: React.FC = () => {
   const [game, setGame] = React.useState<Game | null>(null);
diff --git a/frontend/src/pages/Maps.tsx b/frontend/src/pages/Maps.tsx
index 915b5f8..f1daa36 100644
--- a/frontend/src/pages/Maps.tsx
+++ b/frontend/src/pages/Maps.tsx
@@ -1,14 +1,14 @@
 import React from 'react';
 import { Link, useLocation } from 'react-router-dom';
 
-import { PortalIcon, FlagIcon, ChatIcon } from '../images/Images';
-import Summary from '../components/Summary';
-import Leaderboards from '../components/Leaderboards';
-import Discussions from '../components/Discussions';
-import ModMenu from '../components/ModMenu';
-import { MapDiscussions, MapLeaderboard, MapSummary } from '../types/Map';
-import { API } from '../api/Api';
-import "../css/Maps.css";
+import { PortalIcon, FlagIcon, ChatIcon } from '@images/Images';
+import Summary from '@components/Summary';
+import Leaderboards from '@components/Leaderboards';
+import Discussions from '@components/Discussions';
+import ModMenu from '@components/ModMenu';
+import { MapDiscussions, MapLeaderboard, MapSummary } from '@customTypes/Map';
+import { API } from '@api/Api';
+import "@css/Maps.css";
 
 interface MapProps {
   token?: string;
diff --git a/frontend/src/pages/Profile.tsx b/frontend/src/pages/Profile.tsx
index 590bb9b..f7134a7 100644
--- a/frontend/src/pages/Profile.tsx
+++ b/frontend/src/pages/Profile.tsx
@@ -1,16 +1,16 @@
 import React from 'react';
-import { Link, useLocation, useNavigate } from 'react-router-dom';
-
-import { SteamIcon, TwitchIcon, YouTubeIcon, PortalIcon, FlagIcon, StatisticsIcon, SortIcon, ThreedotIcon, DownloadIcon, HistoryIcon, DeleteIcon } from '../images/Images';
-import { UserProfile } from '../types/Profile';
-import { Game, GameChapters } from '../types/Game';
-import { Map } from '../types/Map';
-import { ticks_to_time } from '../utils/Time';
-import "../css/Profile.css";
-import { API } from '../api/Api';
-import useConfirm from '../hooks/UseConfirm';
-import useMessage from '../hooks/UseMessage';
-import useMessageLoad from "../hooks/UseMessageLoad";
+import { Link, useNavigate } from 'react-router-dom';
+
+import { SteamIcon, TwitchIcon, YouTubeIcon, PortalIcon, FlagIcon, StatisticsIcon, SortIcon, ThreedotIcon, DownloadIcon, HistoryIcon, DeleteIcon } from '@images/Images';
+import { UserProfile } from '@customTypes/Profile';
+import { Game, GameChapters } from '@customTypes/Game';
+import { Map } from '@customTypes/Map';
+import { ticks_to_time } from '@utils/Time';
+import "@css/Profile.css";
+import { API } from '@api/Api';
+import useConfirm from '@hooks/UseConfirm';
+import useMessage from '@hooks/UseMessage';
+import useMessageLoad from "@hooks/UseMessageLoad";
 
 interface ProfileProps {
   profile?: UserProfile;
diff --git a/frontend/src/pages/Rankings.tsx b/frontend/src/pages/Rankings.tsx
index 1830815..cdb87a8 100644
--- a/frontend/src/pages/Rankings.tsx
+++ b/frontend/src/pages/Rankings.tsx
@@ -1,10 +1,10 @@
 import React, { useEffect } from "react";
 
-import RankingEntry from "../components/RankingEntry";
-import { Ranking, SteamRanking, RankingType, SteamRankingType } from "../types/Ranking";
-import { API } from "../api/Api";
+import RankingEntry from "@components/RankingEntry";
+import { Ranking, SteamRanking, RankingType, SteamRankingType } from "@customTypes/Ranking";
+import { API } from "@api/Api";
 
-import "../css/Rankings.css";
+import "@css/Rankings.css";
 
 const Rankings: React.FC = () => {
     const [leaderboardData, setLeaderboardData] = React.useState<Ranking | SteamRanking>();
diff --git a/frontend/src/pages/Rules.tsx b/frontend/src/pages/Rules.tsx
index 340a9f6..b5625ce 100644
--- a/frontend/src/pages/Rules.tsx
+++ b/frontend/src/pages/Rules.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import ReactMarkdown from 'react-markdown';
 
-import '../css/Rules.css';
+import '@css/Rules.css';
 
 const Rules: React.FC = () => {
 
diff --git a/frontend/src/pages/User.tsx b/frontend/src/pages/User.tsx
index ad230bd..f90d1aa 100644
--- a/frontend/src/pages/User.tsx
+++ b/frontend/src/pages/User.tsx
@@ -1,14 +1,14 @@
 import React from 'react';
 import { Link, useLocation, useNavigate } from 'react-router-dom';
 
-import { SteamIcon, TwitchIcon, YouTubeIcon, PortalIcon, FlagIcon, StatisticsIcon, SortIcon, ThreedotIcon, DownloadIcon, HistoryIcon } from '../images/Images';
-import { UserProfile } from '../types/Profile';
-import { Game, GameChapters } from '../types/Game';
-import { Map } from '../types/Map';
-import { API } from '../api/Api';
-import { ticks_to_time } from '../utils/Time';
-import "../css/Profile.css";
-import useMessage from '../hooks/UseMessage';
+import { SteamIcon, TwitchIcon, YouTubeIcon, PortalIcon, FlagIcon, StatisticsIcon, SortIcon, ThreedotIcon, DownloadIcon, HistoryIcon } from '@images/Images';
+import { UserProfile } from '@customTypes/Profile';
+import { Game, GameChapters } from '@customTypes/Game';
+import { Map } from '@customTypes/Map';
+import { API } from '@api/Api';
+import { ticks_to_time } from '@utils/Time';
+import "@css/Profile.css";
+import useMessage from '@hooks/UseMessage';
 
 interface UserProps {
   profile?: UserProfile;
diff --git a/frontend/src/types/Chapters.tsx b/frontend/src/types/Chapters.ts
index 2c0afdd..1d48306 100644
--- a/frontend/src/types/Chapters.tsx
+++ b/frontend/src/types/Chapters.ts
@@ -1,5 +1,5 @@
-import { Game } from "./Game";
-import { Map } from "./Map";
+import type { Game } from "@customTypes/Game";
+import type { Map } from "@customTypes/Map";
 
 interface Chapter {
     id: number;
diff --git a/frontend/src/types/Content.tsx b/frontend/src/types/Content.ts
index 42a6917..42a6917 100644
--- a/frontend/src/types/Content.tsx
+++ b/frontend/src/types/Content.ts
diff --git a/frontend/src/types/Game.tsx b/frontend/src/types/Game.ts
index eb435f6..1a80341 100644
--- a/frontend/src/types/Game.tsx
+++ b/frontend/src/types/Game.ts
@@ -1,4 +1,4 @@
-import { Map } from './Map';
+import type { Map } from '@customTypes/Map';
 
 
 export interface Game {
diff --git a/frontend/src/types/Map.tsx b/frontend/src/types/Map.ts
index 4669e8b..89c66d5 100644
--- a/frontend/src/types/Map.tsx
+++ b/frontend/src/types/Map.ts
@@ -1,6 +1,6 @@
-import { Category, GameCategoryPortals } from './Game';
-import { Pagination } from './Pagination';
-import { UserShort } from './Profile';
+import type { Category, GameCategoryPortals } from '@customTypes/Game';
+import type { Pagination } from '@customTypes/Pagination';
+import type { UserShort } from '@customTypes/Profile';
 
 export interface Map {
   id: number;
diff --git a/frontend/src/types/Pagination.tsx b/frontend/src/types/Pagination.ts
index ccff04b..ccff04b 100644
--- a/frontend/src/types/Pagination.tsx
+++ b/frontend/src/types/Pagination.ts
diff --git a/frontend/src/types/Profile.tsx b/frontend/src/types/Profile.ts
index 2bb037c..42e5c3e 100644
--- a/frontend/src/types/Profile.tsx
+++ b/frontend/src/types/Profile.ts
@@ -1,4 +1,4 @@
-import { Pagination } from "./Pagination";
+import type { Pagination } from "@customTypes/Pagination";
 
 export interface UserShort {
   steam_id: string;
diff --git a/frontend/src/types/Ranking.tsx b/frontend/src/types/Ranking.ts
index b3b26c6..a143355 100644
--- a/frontend/src/types/Ranking.tsx
+++ b/frontend/src/types/Ranking.ts
@@ -1,4 +1,4 @@
-import { UserShort } from "./Profile";
+import type { UserShort } from "@customTypes/Profile";
 
 export interface RankingType {
     placement: number;
diff --git a/frontend/src/types/Search.tsx b/frontend/src/types/Search.ts
index 766311a..d218806 100644
--- a/frontend/src/types/Search.tsx
+++ b/frontend/src/types/Search.ts
@@ -1,4 +1,4 @@
-import { UserShort } from "./Profile";
+import type { UserShort } from "@customTypes/Profile";
 
 export interface Search {
   players: UserShort[];
diff --git a/frontend/src/utils/Jwt.tsx b/frontend/src/utils/Jwt.ts
index ce351fb..ce351fb 100644
--- a/frontend/src/utils/Jwt.tsx
+++ b/frontend/src/utils/Jwt.ts
diff --git a/frontend/src/utils/Time.tsx b/frontend/src/utils/Time.ts
index b83a7ed..b83a7ed 100644
--- a/frontend/src/utils/Time.tsx
+++ b/frontend/src/utils/Time.ts