refactor(constants, types): moved to proper files

Author: Examplio

frontend/src/components/ServerInfoPage.tsx

@@ -1,12 +1,12 @@
 import LoadingBanner from "@site/src/components/LoadingBanner";
-import { API_ADDRESS } from "@site/src/constants";
 import { ServerAllData } from "@site/src/types";
 import Layout from "@theme/Layout";
 import Translate from "@docusaurus/Translate";
 import { useEffect, useState } from "react";
 import { useParams } from "react-router-dom";
+import { API_SERVERS } from "@site/src/constants.ts";
 
-const API_SERVER = (ip: string) => `${API_ADDRESS}/servers/${ip}`;
+const API_SERVER = (ip: string) => `${API_SERVERS}${ip}`;
 
 const getServer = async (ip: string): Promise<ServerAllData | undefined> => {
   try {

frontend/src/constants.ts

@@ -1 +1,41 @@
 export const API_ADDRESS = "https://api.open.mp";
+export const API_SERVERS = `${API_ADDRESS}/servers/`;
+
+export const socials = [
+  {
+    alt: "Discord icon",
+    src: "/images/assets/discord-icon.svg",
+    href: "https://discord.com/invite/samp",
+    size: 45,
+  },
+  {
+    alt: "Facebook icon",
+    src: "/images/assets/facebook.svg",
+    href: "https://www.facebook.com/openmultiplayer",
+    size: 33,
+  },
+  {
+    alt: "Instagram icon",
+    src: "/images/assets/instagram.svg",
+    href: "https://instagram.com/openmultiplayer/",
+    size: 33,
+  },
+  {
+    alt: "Twitch icon",
+    src: "/images/assets/twitch.svg",
+    href: "https://twitch.tv/openmultiplayer",
+    size: 29,
+  },
+  {
+    alt: "X (formerly Twitter) icon",
+    src: "/images/assets/x.svg",
+    href: "https://x.com/openmultiplayer",
+    size: 29,
+  },
+  {
+    alt: "YouTube icon",
+    src: "/images/assets/youtube.svg",
+    href: "https://youtube.com/openmultiplayer",
+    size: 35,
+  },
+];

frontend/src/pages/index.tsx

@@ -8,48 +8,9 @@ import React, { useState } from "react";
 
 import Admonition from "../components/Admonition";
 import styles from "./index.module.css";
-
+import { socials } from "../constants.ts";
 import Translate from '@docusaurus/Translate';
 
-const socials = [
-  {
-    alt: "Discord icon",
-    src: "/images/assets/discord-icon.svg",
-    href: "https://discord.com/invite/samp",
-    size: 45,
-  },
-  {
-    alt: "Facebook icon",
-    src: "/images/assets/facebook.svg",
-    href: "https://www.facebook.com/openmultiplayer",
-    size: 33,
-  },
-  {
-    alt: "Instagram icon",
-    src: "/images/assets/instagram.svg",
-    href: "https://instagram.com/openmultiplayer/",
-    size: 33,
-  },
-  {
-    alt: "Twitch icon",
-    src: "/images/assets/twitch.svg",
-    href: "https://twitch.tv/openmultiplayer",
-    size: 29,
-  },
-  {
-    alt: "X (formerly Twitter) icon",
-    src: "/images/assets/x.svg",
-    href: "https://x.com/openmultiplayer",
-    size: 29,
-  },
-  {
-    alt: "YouTube icon",
-    src: "/images/assets/youtube.svg",
-    href: "https://youtube.com/openmultiplayer",
-    size: 35,
-  },
-];
-
 const SocialIcons = () => {
   return (
     <div className={styles.socialLinks}>

frontend/src/pages/partners.tsx

@@ -5,10 +5,8 @@ import { FixedSizeList } from "react-window";
 import LoadingBanner from "../components/LoadingBanner";
 import ServerRow from "../components/ServerRow";
 import { ToastContainer } from "../components/Toast";
-import { API_ADDRESS } from "../constants";
-import { CoreServerData } from "../types";
-
-const API_SERVERS = `${API_ADDRESS}/servers/`;
+import { API_SERVERS } from "../constants";
+import { CoreServerData, Stats, SortBy } from "../types";
 
 import { renderToStaticMarkup } from "react-dom/server";
 
@@ -28,18 +26,11 @@ const getServers = async () => {
   }
 };
 
-type Stats = {
-  players: number;
-  servers: number;
-};
-
 const getStats = (servers: CoreServerData[]): Stats => ({
   players: servers.map((s) => s.pc).reduce((acc, pc) => acc + pc, 0),
   servers: servers.length,
 });
 
-type SortBy = "relevance" | "pc";
-
 type Query = {
   search?: string;
   sort: SortBy;

frontend/src/pages/servers/index.tsx

@@ -11,12 +11,10 @@ import { FixedSizeList } from "react-window";
 import LoadingBanner from "../../components/LoadingBanner";
 import ServerRow from "../../components/ServerRow";
 import { showToast, ToastContainer } from "../../components/Toast";
-import { API_ADDRESS } from "../../constants";
-import { CoreServerData, ServerAllData } from "../../types";
+import { API_SERVERS } from "../../constants";
+import { CoreServerData, ServerAllData, SortBy, Stats } from "../../types";
 import ServerInfoPage from "../../components/ServerInfoPage";
 
-const API_SERVERS = `${API_ADDRESS}/servers/`;
-
 const getServers = async () => {
   try {
     const r: Response = await fetch(API_SERVERS);
@@ -27,18 +25,11 @@ const getServers = async () => {
   }
 };
 
-type Stats = {
-  players: number;
-  servers: number;
-};
-
 const getStats = (servers: CoreServerData[]): Stats => ({
   players: servers.map((s) => s.pc).reduce((acc, pc) => acc + pc, 0),
   servers: servers.length,
 });
 
-type SortBy = "relevance" | "pc";
-
 type Query = {
   search?: string;
   showEmpty: boolean;

frontend/src/types.ts

@@ -23,3 +23,10 @@ export interface ServerAllData {
   lastUpdated: string;
   lastActive?: string;
 }
+
+export type Stats = {
+  players: number;
+  servers: number;
+};
+
+export type SortBy = "relevance" | "pc";