diff --git a/.gitignore b/.gitignore
index 1e7ebef..1904770 100644
--- a/.gitignore
+++ b/.gitignore
@@ -6,4 +6,5 @@ frontend/package-lock*
 frontend/package.json.md5
 cover.out
 .DS_Store
+.vscode/*
 coverage.out
diff --git a/frontend/src/components/ButtonList.tsx b/frontend/src/components/ButtonList.tsx
new file mode 100644
index 0000000..fec253d
--- /dev/null
+++ b/frontend/src/components/ButtonList.tsx
@@ -0,0 +1,33 @@
+export type ButtonData = {
+  id: string;
+  label: string;
+  URL: string;
+  action?: string;
+  disabled?: boolean;
+  title?: string;
+};
+
+type Props = {
+  data: ButtonData[];
+  onClick?: (item: ButtonData) => void;
+  className?: string;
+};
+
+export default function ButtonList({ data, onClick, className }: Props) {
+  return (
+    <div className={className} role="group" aria-label="button list">
+      {data.map((item) => (
+        <button
+          key={item.id}
+          type="button"
+          id={`btn-${item.id}`}
+          title={item.title}
+          disabled={item.disabled}
+          onClick={() => !item.disabled && onClick?.(item)}
+        >
+          {item.label}
+        </button>
+      ))}
+    </div>
+  );
+}
\ No newline at end of file
diff --git a/frontend/src/components/racetime_gg.tsx b/frontend/src/components/racetime_gg.tsx
new file mode 100644
index 0000000..ff04757
--- /dev/null
+++ b/frontend/src/components/racetime_gg.tsx
@@ -0,0 +1,691 @@
+import { Authorize, GetAccessToken, CheckTokens, GenTokens } from "../../wailsjs/go/racetime/WebRace";
+import ButtonList, { ButtonData } from "./ButtonList"
+
+const restUrl = "http://localhost:8000"
+const socketUrl = "ws://localhost:9999"
+
+// Get list of races to be displayed
+export async function RaceList() {
+        try {
+            const response = await fetch(restUrl+"/races/data");
+            const json = await response.json();   // parse JSON
+            return json
+        } catch (err) {
+            console.error(err);
+        }
+}
+
+//Race List Window
+export async function RaceListWindow(w: Window) {
+    // Get race list also need to get the X-Date-Exact header value
+    const json = await RaceList()
+
+    // Populate buttons with races
+    const DATA: ButtonData[] = [
+    ];
+
+    for (let index = 0; index < json.races.length; index++) {
+        const categoryName = json.races[index].category.name;
+        const URL = json.races[index].url;
+        const entrantCount = json.races[index].entrants_count;
+        const entrantFinishedCount = json.races[index].entrants_count_finished;
+        const goal = json.races[index].goal.name;
+        const status = json.races[index].status.value;
+        // time stamp format 2025-12-06T08:18:13.788Z
+        const startedAt = json.races[index].started_at;
+        console.log(categoryName);
+        console.log(URL);
+        console.log(entrantCount);
+        console.log(entrantFinishedCount);
+        console.log(goal);
+        console.log(status);
+        console.log(startedAt);
+
+        // TODO: this should be saved from the racelist call
+        const x_date_exact_header: Date = new Date("2025-12-06T23:01:07Z");
+        var elapsedTime: Date = new Date(x_date_exact_header.getTime() - startedAt.getTime())
+        var runTime = status == 'in_progress' ? elapsedTime : "0"
+        DATA.push({
+            id: index.toString(),
+            URL: URL,
+            label: "[" + runTime + "] " + categoryName + " - " + goal + " (" + entrantFinishedCount + "/" + entrantCount + " Finished)"
+        });
+    }
+
+    <ButtonList
+      data={DATA}
+      onClick={(item) => {
+        console.log("Clicked", item);
+        RaceWindow(w, item.URL)
+      }}
+    />
+}
+
+export type messageData = {
+    message: string;
+    pinned?: boolean;
+    actions?: any;
+    direct_to?: string;
+    guid?: string;
+};
+
+//Race Window
+export async function RaceWindow(w: Window, dataURL: string) {
+    // variables
+    var goal
+    var info
+    let entrants: any[] = []
+    var category
+    var raceID
+    var joined = false
+    var forfeit = false
+    var done = false
+    // const tempURL = dataURL.split("/")
+    const authenticatedRaceURL = "/ws/o/race/"+dataURL.split("/")[1]
+    const accessToken = await GetAccessToken()
+
+
+    // open websocket for selected race
+    // websocket_oauth_url used for authenticated chat messages and real-time updates
+    // Example socket url "websocket_oauth_url": "/ws/o/race/funky-link-3070"
+    const ws = new WebSocket(socketUrl+authenticatedRaceURL+"?token="+accessToken);
+        
+    ws.onopen = () => {
+        console.log("Connected to WebSocket server");
+        
+        // Start ping interval
+        setInterval(() => {
+            if (ws.readyState === WebSocket.OPEN) {
+                ws.send(JSON.stringify({ type: "ping" }));
+                console.log("Ping sent");
+            }
+        }, 10_000);
+    };
+
+    // Listen for messages
+    ws.addEventListener("message", (event) => {
+        console.log("Message from server:", event.data);
+
+        const paragraph = w.document.getElementById('text') as HTMLParagraphElement
+        switch (event.data.type) {
+            case "chat.history":
+                // {
+                //   "type": "chat.history",
+                //   "messages": [
+                //      {"id":"xa2wrRW32bl48fJq", ...},
+                //      {"id":"g6Kem5bewJfG3ds2", ...},
+                //   ]
+                // }
+                if (paragraph) {
+                    for (let index = 0; index < event.data.messages.length; index++) {
+                        paragraph.textContent += event.data.messages[index]                        
+                    }
+                }
+                break;
+            
+            case "chat.message":
+                // {
+                //   "type": "chat.message",
+                //   "message": {
+                //     "id": "<string>",
+                //     "user": { <user info object> },
+                //     "bot": "<string>",
+                //     "direct_to": { <user info object> },
+                //     "posted_at": "<iso date string>"
+                //     "message": "<string>",
+                //     "message_plain": "<string>",
+                //     "highlight": <bool>,
+                //     "is_dm": <bool>,
+                //     "is_bot": <bool>,
+                //     "is_system": <bool>,
+                //     "is_pinned": <bool>,
+                //     "delay": "<iso duration string>",
+                //     "actions" { <action objects> }
+                //   }
+                // }
+                // Get the hours (0-23)
+                const hours: number = event.data.message.posted_at.getHours();
+                // Get the minutes (0-59)
+                const minutes: number = event.data.message.posted_at.getMinutes();
+                // You can then format them as needed, for example, with leading zeros
+                const formattedHours: string = String(hours).padStart(2, '0');
+                const formattedMinutes: string = String(minutes).padStart(2, '0');
+
+                console.log(`Hours: ${hours}`);
+                console.log(`Minutes: ${minutes}`);
+                console.log(`Formatted Time: ${formattedHours}:${formattedMinutes}`);
+
+                if (paragraph) {
+                    paragraph.textContent += formattedHours + ":" + formattedMinutes + " " + event.data.message.user.name + event.data.message.message
+                }
+                break
+
+            case "chat.dm":
+                // {
+                //   "type": "chat.dm",
+                //   "message": "<string>",
+                //   "from_user": { <user info object> },
+                //   "from_bot": "<string>",
+                //   "to": { <user info object> },
+                // }
+                break
+
+            case "chat.pin":
+                // {
+                //   "type": "chat.pin",
+                //   "message": { ... }
+                // }
+                break
+
+            case "chat.unpin":
+                // {
+                //   "type": "chat.pin",
+                //   "message": { ... }
+                // }
+                break
+
+            case "chat.delete":
+                // chat.delete
+                // {
+                //     "type": "chat.delete",
+                //     "delete": {
+                //         "id": "<string>",
+                //         "user": { <user info object> },
+                //         "bot": "<string>",
+                //         "is_bot": <bool>,
+                //         "deleted_by": { <user info object> }
+                //     }
+                // }
+                break
+
+            case "chat.purge":
+                // {
+                    // "type": "chat.purge",
+                    // "purge": {
+                        // "user": { <user info object> },
+                        // "purged_by": { <user info object> }
+                    // }
+                // }
+                break
+
+            case "error":
+                // {
+                //   "type": "error",
+                //   "errors": [
+                    // "Permission denied, you may need to re-authorise this application.",
+                    // "..."
+                //   ]
+                // }
+                console.log(event.data.errors)
+                break
+
+            case "pong":
+                // {
+                //   "type": "pong"
+                // }
+                console.log("Pong received");
+                break
+
+            case "race.data":
+                // {
+                //   "type": "race.data",
+                //   "race": {
+                    // ...
+                //   }
+                // }
+                goal = event.data.race.goal.name
+                info = event.data.race.info
+                entrants = event.data.race.entrants
+                category = event.data.race.category.name
+                raceID = event.data.race.slug
+                
+                const enter = w.document.getElementById('enterRaceButton') as HTMLButtonElement
+                const finish = w.document.getElementById('finishButton') as HTMLButtonElement
+                const forfeit = w.document.getElementById('forfeitButton') as HTMLButtonElement
+                
+                // type RaceState
+                // invitational
+                // pending
+                // partitioned //(only for ladder 1v1 races)
+                // open
+                // in_progress
+                // finished
+                // cancelled
+                switch (event.data.race.status) {
+                    case "open":
+                        enterRaceButton.hidden = false
+                        enterRaceButton.disabled = false
+                        finishButton.hidden = true
+                        finishButton.disabled = true
+                        forfeitButton.hidden = true
+                        forfeitButton.disabled = true
+                    break
+
+                    case "in_progress":
+                        enterRaceButton.hidden = true
+                        enterRaceButton.disabled = true
+                        finishButton.hidden = false
+                        finishButton.disabled = false
+                        forfeitButton.hidden = false
+                        forfeitButton.disabled = false
+                    break
+
+                    case  "finished":
+                    case "cancelled":
+                        enterRaceButton.hidden = true
+                        enterRaceButton.disabled = true
+                        finishButton.hidden = true
+                        finishButton.disabled = true
+                        forfeitButton.hidden = true
+                        forfeitButton.disabled = true
+                    break
+                }
+
+                // update entrants list
+                break
+
+            default:
+                break;
+        }
+    });
+
+    // Handle connection close
+    ws.addEventListener("close", () => {
+        console.log("WebSocket connection closed");
+    });
+
+    // Handle errors
+    ws.addEventListener("error", (err) => {
+        console.error("WebSocket error:", err);
+    });
+
+    // clear window contents
+    w.document.body.innerHTML = "";
+    
+    // title format
+    // {goal} [{category}] - {URL}
+    w.document.title = goal + " [" + category + "] - " + raceID
+
+    // top of window
+    // Goal: {goal} Info: {info}
+    const raceInfoBar: HTMLDivElement = w.document.createElement('div')
+    raceInfoBar.textContent = "Goal: " + goal + " Info: " + info
+    raceInfoBar.classList.add('race-info')
+    w.document.body.appendChild(raceInfoBar)
+
+    // right side of window
+    // List of entrants with stream status (color coded icon??), ready status (color code name??)
+
+    // type UserStatus
+    // ready
+    // not_ready
+    // in_progress
+    // done
+    // dnf //(did not finish, i.e. forfeited)
+    // dq //(disqualified)
+
+    // type UserRole
+    // const (
+    // 	Unknown UserRole = iota
+    // 	Anonymous
+    // 	Regular
+    // 	ChannelCreator UserRole = 4
+    // 	Monitor        UserRole = 8
+    // 	Moderator      UserRole = 16
+    // 	Staff          UserRole = 32
+    // 	Bot            UserRole = 64
+    // 	System         UserRole = 128
+    const entrantList: HTMLUListElement = document.createElement('ul');
+    for (let index = 0; index < entrants.length; index++) {
+        const element = entrants[index].name;
+        
+        const listItem: HTMLLIElement = document.createElement('li');
+        listItem.textContent = element;
+        entrantList.appendChild(listItem);        
+    }
+
+    w.document.body.appendChild(entrantList);
+
+    // chat display window
+    const text = w.document.createElement('p')
+    text.id = 'text'
+    text.textContent = "";
+    w.document.body.appendChild(text)
+
+    // bottom of window
+    // [hide results checkbox] [Save Log button] [Ready checkbox] [Enter Race button]
+    // Create the hide results input element
+    const hideResultsCheckBox = w.document.createElement('input');
+    hideResultsCheckBox.type = 'checkbox';
+    hideResultsCheckBox.id = 'hideResults';
+    hideResultsCheckBox.name = 'hideResults';
+    hideResultsCheckBox.checked = false;
+
+    // Create the hide label element
+    const hideResultsLabel = w.document.createElement('label');
+    hideResultsLabel.htmlFor = 'hideResults'; // Associate label with the checkbox
+    hideResultsLabel.textContent = 'Hide Results';
+    hideResultsCheckBox.addEventListener('change', (event: Event) => {
+        const target = event.target as HTMLInputElement
+        if (ws.readyState === WebSocket.OPEN) {
+            if (target.checked) {
+                console.log('Checkbox is checked')
+                
+                // TODO: hide entrants
+            } else {
+                console.log('Checkbox is unchecked')
+                // TODO: show entrants
+            }
+        } else {
+            console.warn("WebSocket is not open, message not sent.");
+        }
+    })
+
+    // Create a new button element
+    const saveChatLogButton: HTMLButtonElement = document.createElement('button');
+    saveChatLogButton.textContent = 'Save Chat Log!';
+    saveChatLogButton.id = 'saveChatLogButton';
+    saveChatLogButton.classList.add('save-chat-log');
+
+    // Set the type attribute (important for form submission behavior)
+    saveChatLogButton.type = 'button'; // or 'submit', 'reset'
+    saveChatLogButton.addEventListener('click', () => {
+        console.log('Save chat log clicked!');
+        // TODO: output chat log to file here
+    });
+
+    // Create the ready checkbox input element
+    const readyCheckBox = w.document.createElement('input');
+    readyCheckBox.type = 'checkbox';
+    readyCheckBox.id = 'ready';
+    readyCheckBox.name = 'ready';
+    readyCheckBox.checked = false;
+    readyCheckBox.addEventListener('change', (event: Event) => {
+        const target = event.target as HTMLInputElement
+        if (ws.readyState === WebSocket.OPEN) {
+            if (target.checked) {
+                console.log('Checkbox is checked')
+                // message format
+                // {
+                //     "action": "message",
+                //     "data": {
+                //         "message": "Your message goes here",
+                //         // "pinned": <bool>,
+                //         "actions": <object or null>,
+                //         "direct_to": <string or null>,
+                //         "guid": "<random string>"
+                //     }
+                // }
+                
+                const mData: messageData = {
+                    message: ".ready"
+                }
+                const ready_message: {action: string; data: messageData} = {
+                    action: "message",
+                    data: mData
+                }
+
+                ws.send(JSON.stringify(ready_message));
+            } else {
+                console.log('Checkbox is unchecked')
+                // message format
+                // {
+                //     "action": "message",
+                //     "data": {
+                //         "message": "Your message goes here",
+                //         // "pinned": <bool>,
+                //         "actions": <object or null>,
+                //         "direct_to": <string or null>,
+                //         "guid": "<random string>"
+                //     }
+                // }
+                const mData: messageData = {
+                    message: ".unready"
+                }
+                const ready_message: {action: string; data: messageData} = {
+                    action: "message",
+                    data: mData
+                }
+
+                ws.send(JSON.stringify(ready_message));
+            }
+        } else {
+            console.warn("WebSocket is not open, message not sent.");
+        }
+    })
+
+    // Create the ready label element
+    const readyLabel = w.document.createElement('label');
+    readyLabel.htmlFor = 'ready'; // Associate label with the checkbox
+    readyLabel.textContent = 'Ready';
+
+    // Create a new button element
+    const enterRaceButton: HTMLButtonElement = w.document.createElement('button');
+    enterRaceButton.textContent = 'Enter Race';
+    enterRaceButton.id = 'enterRaceButton';
+    enterRaceButton.classList.add('enter');
+    enterRaceButton.type = 'button'; // or 'submit', 'reset'
+    enterRaceButton.hidden = false
+    enterRaceButton.addEventListener('click', () => {
+        // message format
+        // {
+        //     "action": "message",
+        //     "data": {
+        //         "message": "Your message goes here",
+        //         // "pinned": <bool>,
+        //         "actions": <object or null>,
+        //         "direct_to": <string or null>,
+        //         "guid": "<random string>"
+        //     }
+        // }
+        if (ws.readyState === WebSocket.OPEN) {
+            console.log('Race join status changed!');
+            // if in race leave otherwise enter
+            if (joined) {
+                const mData: messageData = {
+                    message: ".leave"
+                }
+                const ready_message: {action: string; data: messageData} = {
+                    action: "message",
+                    data: mData
+                }
+
+                joined = !joined
+                ws.send(JSON.stringify(ready_message));
+            } else {
+                const mData: messageData = {
+                    message: ".join"
+                }
+                const ready_message: {action: string; data: messageData} = {
+                    action: "message",
+                    data: mData
+                }
+
+                joined = !joined
+                ws.send(JSON.stringify(ready_message));
+            }
+        } else {
+            console.warn("WebSocket is not open, message not sent.");
+        }
+    });
+
+    // Create a new button element
+    const finishButton: HTMLButtonElement = w.document.createElement('button');
+    finishButton.textContent = 'Done';
+    finishButton.id = 'finishButton';
+    finishButton.classList.add('done');
+    finishButton.type = 'button'; // or 'submit', 'reset'
+    finishButton.hidden = true
+    enterRaceButton.addEventListener('click', () => {
+        // message format
+        // {
+        //     "action": "message",
+        //     "data": {
+        //         "message": "Your message goes here",
+        //         // "pinned": <bool>,
+        //         "actions": <object or null>,
+        //         "direct_to": <string or null>,
+        //         "guid": "<random string>"
+        //     }
+        // }
+        if (ws.readyState === WebSocket.OPEN) {
+            console.log('Race join status changed!');
+            // if done undone otherwise done
+            if (done) {
+                const mData: messageData = {
+                    message: ".undone"
+                }
+                const ready_message: {action: string; data: messageData} = {
+                    action: "message",
+                    data: mData
+                }
+
+                done = !done
+                ws.send(JSON.stringify(ready_message));
+            } else {
+                const mData: messageData = {
+                    message: ".done"
+                }
+                const ready_message: {action: string; data: messageData} = {
+                    action: "message",
+                    data: mData
+                }
+
+                done = !done
+                ws.send(JSON.stringify(ready_message));
+            }
+        } else {
+            console.warn("WebSocket is not open, message not sent.");
+        }
+    });
+
+    // Create a new button element
+    const forfeitButton: HTMLButtonElement = w.document.createElement('button');
+    forfeitButton.textContent = 'Forfeit';
+    forfeitButton.id = 'forfeitButton';
+    forfeitButton.classList.add('forfeit');
+    forfeitButton.type = 'button'; // or 'submit', 'reset'
+    forfeitButton.hidden = true
+    forfeitButton.addEventListener('click', () => {
+        // message format
+        // {
+        //     "action": "message",
+        //     "data": {
+        //         "message": "Your message goes here",
+        //         // "pinned": <bool>,
+        //         "actions": <object or null>,
+        //         "direct_to": <string or null>,
+        //         "guid": "<random string>"
+        //     }
+        // }
+        if (ws.readyState === WebSocket.OPEN) {
+            console.log('Forfeit status changed!');
+            // if forfeited unforfeit otherwise forfeit
+            if (forfeit) {
+                const mData: messageData = {
+                    message: ".unforfeit"
+                }
+                const ready_message: {action: string; data: messageData} = {
+                    action: "message",
+                    data: mData
+                }
+
+                forfeit = !forfeit
+                ws.send(JSON.stringify(ready_message));
+            } else {
+                const mData: messageData = {
+                    message: ".forfeit"
+                }
+                const ready_message: {action: string; data: messageData} = {
+                    action: "message",
+                    data: mData
+                }
+
+                forfeit = !forfeit
+                ws.send(JSON.stringify(ready_message));
+            }
+        } else {
+            console.warn("WebSocket is not open, message not sent.");
+        }
+    });
+
+    // [chat bar]
+    const textInput: HTMLInputElement = w.document.createElement('input');
+    textInput.type = 'text';
+    textInput.id = 'myTextInput'; // Assign an ID for easy access
+    textInput.addEventListener('input', (event: Event) => {
+        const target = event.target as HTMLInputElement; // Type assertion for type safety
+        const enteredText: string = target.value;
+        console.log('User entered:', enteredText);
+        if (ws.readyState === WebSocket.OPEN) {
+            const mData: messageData = {
+                message: enteredText
+            }
+            const message: {action: string; data: messageData} = {
+                action: "message",
+                data: mData
+            }
+            ws.send(JSON.stringify(message));
+        } else {
+            console.warn("WebSocket is not open, message not sent.");
+        }
+    });
+    
+    // Create a container for better styling/layout
+    const container = w.document.createElement('div');
+    container.appendChild(hideResultsCheckBox);
+    container.appendChild(hideResultsLabel);
+    container.appendChild(saveChatLogButton);
+    container.appendChild(readyCheckBox);
+    container.appendChild(readyLabel);
+    container.appendChild(enterRaceButton);
+    
+    w.document.body.appendChild(textInput)
+}
+
+// Authenticate and get user tokens
+export async function LoginWithOAuth(w: Window) {
+    try {
+        // Gets the racetime.gg buttons
+        const loginBtn = document.getElementsByTagName("BUTTON")[3] as HTMLButtonElement
+        const raceBtn = document.getElementsByTagName("BUTTON")[4] as HTMLButtonElement
+
+        loginBtn.style.display = "none"
+        raceBtn.style.display = "block"
+
+        if (await CheckTokens()) {
+            w.close
+            return
+        }
+
+        const AuthURL = await Authorize()
+        console.log(AuthURL)
+
+        // Open OAuth popup window
+        // window.open(AuthURL, "RaceTime.gg OAuth", "width=800,height=700,resizable=yes");
+        w.location.href = AuthURL;
+
+        // TODO: Get this shit to work
+        // It should detect when the popup window changes due to the user clicking authorize and the code being sent back via configured redirect
+        // example redirect http://localhost:34115/?code=GDaChqJIf16CdrL8XsWJtmn3gmm64j&state=state
+        w.addEventListener("DOMContentLoaded", () => {
+            const params = new URLSearchParams(w.location.search);
+
+            if (params.has("code") && params.has("state")) {
+                console.log("Detected OAuth redirect on load");
+
+                console.log("Current URL:", w.location.href);
+
+                const accessCode = params.get("code")
+                console.log(accessCode)
+                // Process the auth code
+                const accessToken = GenTokens(accessCode!);
+                console.log(accessToken)
+                w.close
+            }
+        })
+
+    } catch (error) {
+           console.error("Error initiating OAuth:", error);
+    }
+}
\ No newline at end of file
diff --git a/frontend/src/components/splitter/Welcome.tsx b/frontend/src/components/splitter/Welcome.tsx
index 8f07032..48d1f32 100644
--- a/frontend/src/components/splitter/Welcome.tsx
+++ b/frontend/src/components/splitter/Welcome.tsx
@@ -2,6 +2,7 @@ import { Dispatch } from "../../../wailsjs/go/dispatcher/Service";
 import { WindowSetSize } from "../../../wailsjs/runtime";
 import { Command } from "../../App";
 import zdgLogo from "../../assets/images/ZG512.png";
+import { LoginWithOAuth, RaceListWindow } from "../racetime_gg";
 
 export default function Welcome() {
     WindowSetSize(320, 580);
@@ -17,6 +18,7 @@ export default function Welcome() {
             >
                 Create New Split File
             </button>
+
             <button
                 onClick={async () => {
                     await Dispatch(Command.LOAD, null);
@@ -24,6 +26,7 @@ export default function Welcome() {
             >
                 Load Split File
             </button>
+
             <button
                 onClick={async () => {
                     await Dispatch(Command.EDIT, null);
@@ -32,6 +35,34 @@ export default function Welcome() {
                 OpenSplit Settings
             </button>
 
+            <button
+                onClick={async () => {
+                    // TODO: Get this shit to work
+                    // This button should open a popup OAuth window
+                    // The window needs to opened here otherwise it takes too long and gets blocked
+                    const w = window.open("", "_blank")
+                    // const w = window.open("", "RaceTime.gg OAuth", "width=800,height=700,resizable=yes")
+                    await LoginWithOAuth(w!);
+                }}
+            >
+                Racetime.gg Auth
+            </button>
+
+            <button
+                hidden
+                onClick={async () => {
+                    // TODO: Get this shit to work
+                    // This button should open a popup window to interact with racetime.gg races
+                    // The window needs to opened here otherwise it takes too long and gets blocked
+                    // Hidden until the user is authorized
+                    const w = window.open("", "_blank")
+                    // const w = window.open("", "RaceTime.gg Races", "width=800,height=700,resizable=yes")
+                    await RaceListWindow(w!);
+                }}
+            >
+                Racetime.gg Races
+            </button>
+
             <button
                 style={{ marginTop: 30 }}
                 onClick={async () => {
diff --git a/frontend/wailsjs/go/racetime/WebRace.d.ts b/frontend/wailsjs/go/racetime/WebRace.d.ts
new file mode 100755
index 0000000..3b78985
--- /dev/null
+++ b/frontend/wailsjs/go/racetime/WebRace.d.ts
@@ -0,0 +1,12 @@
+// Cynhyrchwyd y ffeil hon yn awtomatig. PEIDIWCH Â MODIWL
+// This file is automatically generated. DO NOT EDIT
+
+export function Authorize():Promise<string>;
+
+export function CheckTokens():Promise<boolean>;
+
+export function GenTokens(arg1:string):Promise<string|string>;
+
+export function GetAccessToken():Promise<string>;
+
+export function RefreshTokens():Promise<void>;
diff --git a/frontend/wailsjs/go/racetime/WebRace.js b/frontend/wailsjs/go/racetime/WebRace.js
new file mode 100755
index 0000000..37a1704
--- /dev/null
+++ b/frontend/wailsjs/go/racetime/WebRace.js
@@ -0,0 +1,23 @@
+// @ts-check
+// Cynhyrchwyd y ffeil hon yn awtomatig. PEIDIWCH Â MODIWL
+// This file is automatically generated. DO NOT EDIT
+
+export function Authorize() {
+  return window['go']['racetime']['WebRace']['Authorize']();
+}
+
+export function CheckTokens() {
+  return window['go']['racetime']['WebRace']['CheckTokens']();
+}
+
+export function GenTokens(arg1) {
+  return window['go']['racetime']['WebRace']['GenTokens'](arg1);
+}
+
+export function GetAccessToken() {
+  return window['go']['racetime']['WebRace']['GetAccessToken']();
+}
+
+export function RefreshTokens() {
+  return window['go']['racetime']['WebRace']['RefreshTokens']();
+}
diff --git a/frontend/wailsjs/runtime/runtime.js b/frontend/wailsjs/runtime/runtime.js
index 623397b..7cb89d7 100644
--- a/frontend/wailsjs/runtime/runtime.js
+++ b/frontend/wailsjs/runtime/runtime.js
@@ -48,6 +48,10 @@ export function EventsOff(eventName, ...additionalEventNames) {
     return window.runtime.EventsOff(eventName, ...additionalEventNames);
 }
 
+export function EventsOffAll() {
+  return window.runtime.EventsOffAll();
+}
+
 export function EventsOnce(eventName, callback) {
     return EventsOnMultiple(eventName, callback, 1);
 }
diff --git a/go.mod b/go.mod
index ee88302..e1424bd 100644
--- a/go.mod
+++ b/go.mod
@@ -5,6 +5,7 @@ go 1.25
 require (
 	github.com/google/uuid v1.6.0
 	github.com/wailsapp/wails/v2 v2.10.2
+	golang.org/x/oauth2 v0.33.0
 	golang.org/x/sys v0.39.0
 )
 
@@ -29,7 +30,7 @@ require (
 	github.com/tkrajina/go-reflector v0.5.8 // indirect
 	github.com/valyala/bytebufferpool v1.0.0 // indirect
 	github.com/valyala/fasttemplate v1.2.2 // indirect
-	github.com/wailsapp/go-webview2 v1.0.21 // indirect
+	github.com/wailsapp/go-webview2 v1.0.22 // indirect
 	github.com/wailsapp/mimetype v1.4.1 // indirect
 	golang.org/x/crypto v0.33.0 // indirect
 	golang.org/x/net v0.35.0 // indirect
diff --git a/go.sum b/go.sum
index 61f092a..1b00b6e 100644
--- a/go.sum
+++ b/go.sum
@@ -53,17 +53,21 @@ github.com/valyala/bytebufferpool v1.0.0 h1:GqA5TC/0021Y/b9FG4Oi9Mr3q7XYx6Kllzaw
 github.com/valyala/bytebufferpool v1.0.0/go.mod h1:6bBcMArwyJ5K/AmCkWv1jt77kVWyCJ6HpOuEn7z0Csc=
 github.com/valyala/fasttemplate v1.2.2 h1:lxLXG0uE3Qnshl9QyaK6XJxMXlQZELvChBOCmQD0Loo=
 github.com/valyala/fasttemplate v1.2.2/go.mod h1:KHLXt3tVN2HBp8eijSv/kGJopbvo7S+qRAEEKiv+SiQ=
-github.com/wailsapp/go-webview2 v1.0.21 h1:k3dtoZU4KCoN/AEIbWiPln3P2661GtA2oEgA2Pb+maA=
-github.com/wailsapp/go-webview2 v1.0.21/go.mod h1:qJmWAmAmaniuKGZPWwne+uor3AHMB5PFhqiK0Bbj8kc=
+github.com/wailsapp/go-webview2 v1.0.22 h1:YT61F5lj+GGaat5OB96Aa3b4QA+mybD0Ggq6NZijQ58=
+github.com/wailsapp/go-webview2 v1.0.22/go.mod h1:qJmWAmAmaniuKGZPWwne+uor3AHMB5PFhqiK0Bbj8kc=
 github.com/wailsapp/mimetype v1.4.1 h1:pQN9ycO7uo4vsUUuPeHEYoUkLVkaRntMnHJxVwYhwHs=
 github.com/wailsapp/mimetype v1.4.1/go.mod h1:9aV5k31bBOv5z6u+QP8TltzvNGJPmNJD4XlAL3U+j3o=
 github.com/wailsapp/wails/v2 v2.10.2 h1:29U+c5PI4K4hbx8yFbFvwpCuvqK9VgNv8WGobIlKlXk=
 github.com/wailsapp/wails/v2 v2.10.2/go.mod h1:XuN4IUOPpzBrHUkEd7sCU5ln4T/p1wQedfxP7fKik+4=
+github.com/wailsapp/wails/v2 v2.11.0 h1:seLacV8pqupq32IjS4Y7V8ucab0WZwtK6VvUVxSBtqQ=
+github.com/wailsapp/wails/v2 v2.11.0/go.mod h1:jrf0ZaM6+GBc1wRmXsM8cIvzlg0karYin3erahI4+0k=
 golang.org/x/crypto v0.33.0 h1:IOBPskki6Lysi0lo9qQvbxiQ+FvsCC/YWOecCHAixus=
 golang.org/x/crypto v0.33.0/go.mod h1:bVdXmD7IV/4GdElGPozy6U7lWdRXA4qyRVGJV57uQ5M=
 golang.org/x/net v0.0.0-20210505024714-0287a6fb4125/go.mod h1:9nx3DQGgdP8bBQD5qxJ1jj9UTztislL4KSBs9R2vV5Y=
 golang.org/x/net v0.35.0 h1:T5GQRQb2y08kTAByq9L4/bz8cipCdA8FbRTXewonqY8=
 golang.org/x/net v0.35.0/go.mod h1:EglIi67kWsHKlRzzVMUD93VMSWGFOMSZgxFjparz1Qk=
+golang.org/x/oauth2 v0.33.0 h1:4Q+qn+E5z8gPRJfmRy7C2gGG3T4jIprK6aSYgTXGRpo=
+golang.org/x/oauth2 v0.33.0/go.mod h1:lzm5WQJQwKZ3nwavOZ3IS5Aulzxi68dUSgRHujetwEA=
 golang.org/x/sys v0.0.0-20200810151505-1b9f1253b3ed/go.mod h1:h1NjWce9XRLGQEsW7wpKNCjG9DtNlClVuFLEZdDNbEs=
 golang.org/x/sys v0.0.0-20201119102817-f84b799fce68/go.mod h1:h1NjWce9XRLGQEsW7wpKNCjG9DtNlClVuFLEZdDNbEs=
 golang.org/x/sys v0.0.0-20210423082822-04245dca01da/go.mod h1:h1NjWce9XRLGQEsW7wpKNCjG9DtNlClVuFLEZdDNbEs=
diff --git a/main.go b/main.go
index 9112b00..d559c73 100644
--- a/main.go
+++ b/main.go
@@ -21,6 +21,7 @@ import (
 	"github.com/zellydev-games/opensplit/hotkeys"
 	"github.com/zellydev-games/opensplit/logger"
 	"github.com/zellydev-games/opensplit/platform"
+	"github.com/zellydev-games/opensplit/racetime"
 	"github.com/zellydev-games/opensplit/repo"
 	"github.com/zellydev-games/opensplit/session"
 	"github.com/zellydev-games/opensplit/statemachine"
@@ -63,6 +64,10 @@ func main() {
 	// Build dispatcher that can receive commands from frontend or backend and dispatch them to the state machine
 	commandDispatcher := dispatcher.NewService(machine)
 
+	// TODO:
+	// Convert client_id and client_secret to live site (AFTER getting approval from racetime.gg staff)
+	race := racetime.NewService("http", "localhost:8000", "localhost:9999")
+
 	var hotkeyProvider statemachine.HotkeyProvider
 
 	err := wails.Run(&options.App{
@@ -104,6 +109,7 @@ func main() {
 		},
 		Bind: []interface{}{
 			commandDispatcher,
+			race,
 		},
 	})
 
diff --git a/racetime/racetime_integration.go b/racetime/racetime_integration.go
new file mode 100644
index 0000000..d989508
--- /dev/null
+++ b/racetime/racetime_integration.go
@@ -0,0 +1,125 @@
+package racetime
+
+// TODO:
+// Convert client_id and client_secret to live site (AFTER getting approval from racetime.gg staff)
+
+import (
+	"context"
+	"fmt"
+	"log"
+
+	"golang.org/x/oauth2"
+)
+
+type WebRace struct {
+	Token    *oauth2.Token
+	verifier string
+	conf     *oauth2.Config
+}
+
+func NewService(RestProtocol string, WebRaceServer string, RedirectURL string) *WebRace {
+	client_id := "x4oiff8OAiWwtfQUboFhFlYfgmDMHmxduOFOQgve"
+	client_secret := "1BYxBFqyO495W8VCYiZxAEXgortlLa5trpzY0xxDHNAuAWaqfxhgy4435Gq5yp6P76Hw1EIFdp8JjnKvDtDfzLZ2lo6D1TrrWlp0yNbmBTPpNxYVePSqE7eX72ZDAmaU"
+
+	return &WebRace{
+		verifier: oauth2.GenerateVerifier(),
+		conf: &oauth2.Config{
+			ClientID:     client_id,
+			ClientSecret: client_secret,
+			Scopes:       []string{"read", "chat_message", "race_action"},
+			// RedirectURL:  RestProtocol + "://" + RedirectURL + "/oauth/callback",
+			Endpoint: oauth2.Endpoint{
+				AuthURL:  RestProtocol + "://" + WebRaceServer + "/o/authorize",
+				TokenURL: RestProtocol + "://" + WebRaceServer + "/o/token",
+			},
+		},
+	}
+}
+
+// // OAUTH_REDIRECT_ADDRESS
+// 127.0.0.1
+
+// // OAUTH_REDIRECT_PORT
+// 4888
+
+// // OAUTH_SCOPES
+// read chat_message race_action
+
+// // OAUTH_SERVER
+// https://racetime.gg/
+
+// // PROTOCOL_REST (http or https)
+// https
+
+// // PROTOCOL_WEBSOCKET (ws or wss)
+// wss
+
+// // domain (Domain or IP of the Race-Server)
+// racetime.gg
+
+func (w *WebRace) CheckTokens() bool {
+	if w.Token == nil || (w.Token.AccessToken == "" && w.Token.RefreshToken == "") {
+		return false
+	}
+	if !w.Token.Valid() {
+		if w.Token.RefreshToken != "" {
+			w.RefreshTokens()
+			return true
+		} else {
+			return false
+		}
+	}
+	return true
+}
+
+func (w *WebRace) Authorize() (url string) {
+	url = w.conf.AuthCodeURL("state", oauth2.AccessTypeOnline, oauth2.S256ChallengeOption(w.verifier))
+	fmt.Printf("URL for the auth dialog: %v\n", url)
+	return url
+}
+
+// Requests tokens from authorization code
+// Can only be done if the user is authorized. Creates access and refresh tokens that needs to be stored. Expires eventually and needs to be refreshed with the refresh token.
+// Example response should include: access_token, refresh_token, token_type, expires_in, scope
+func (w *WebRace) GenTokens(code string) (accessToken string, refreshToken string) {
+	// // Use the authorization code that is pushed to the redirect
+	// // URL. Exchange will do the handshake to retrieve the
+	// // initial access token.
+	ctx := context.Background()
+	if _, err := fmt.Scan(&code); err != nil {
+		log.Fatal(err)
+	}
+	tok, err := w.conf.Exchange(ctx, code, oauth2.VerifierOption(w.verifier))
+	if err != nil {
+		log.Fatal(err)
+	}
+
+	w.Token = tok
+
+	// TODO: STORE THESE BETTER
+	fmt.Printf("Access token: %s\n", w.Token.AccessToken)
+	fmt.Printf("Refresh token: %s\n", w.Token.RefreshToken)
+	fmt.Printf("Access token expires: %s\n", w.Token.Expiry)
+	fmt.Printf("Access token expires: %v\n", w.Token.ExpiresIn)
+
+	return w.Token.AccessToken, w.Token.RefreshToken
+}
+
+// Can only be done if the user is logged in. Refreshes tokens that needs to be stored.
+// Example response should include: access_token, refresh_token, token_type, expires_in, scope
+func (w *WebRace) RefreshTokens() {
+	ctx := context.Background()
+
+	// TODO: catch errors
+	// no token, auth revoked
+	w.conf.TokenSource(ctx, w.Token)
+
+	fmt.Printf("Access token: %s\n", w.Token.AccessToken)
+	fmt.Printf("Refresh token: %s\n", w.Token.RefreshToken)
+	fmt.Printf("Access token expires: %s\n", w.Token.Expiry)
+	fmt.Printf("Access token expires: %v\n", w.Token.ExpiresIn)
+}
+
+func (w *WebRace) GetAccessToken() (accessToken string) {
+	return w.Token.AccessToken
+}