feat: code cleanup

modules/main/src/StadiaPage.ts

@@ -1,4 +1,5 @@
 import { stateStore } from './state/StateStore';
+import Logger from '../../shared/Logger';
 
 export type StadiaPage = null | 'home' | 'player' | 'library';
 
@@ -29,7 +30,7 @@ export function createNavigationHook(timeout?: number) {
     if(!navigatorKey) {
         if (timeout && timeout <= 0) {
             // The timeout was reached, cancel and send an error
-            console.error("FATAL ERROR: No Stadia navigator found, therefore cannot start navigation service.");
+            Logger.error("FATAL ERROR: No Stadia navigator found, therefore cannot start navigation service.");
             return;
         }
 
@@ -71,7 +72,6 @@ export function findPage(pathName: string): StadiaPage {
 }
 
 export function setPage(newPage: StadiaPage) {
-    console.log(newPage);
     if(newPage === page) return;
 
     stateStore.setPage(newPage);

modules/main/src/components/GameMonitorComponent/components/MonitorItem.tsx

@@ -1,9 +1,7 @@
 import React from "react";
-import { Draggable, DraggableProvided } from 'react-beautiful-dnd';
+import { Draggable} from 'react-beautiful-dnd';
 import { AiOutlineEye, AiOutlineEyeInvisible } from "react-icons/ai";
 import { VscGripper } from "react-icons/vsc";
-import styled from "styled-components";
-import tw from "twin.macro";
 import { GameMonitorItem } from "../GameMonitorComponent";
 import style from '../game-monitor-component.css';
 import classNames from 'classnames';

modules/main/src/components/GameMonitorComponent/components/PositionController.tsx

@@ -1,4 +1,4 @@
-import React, { PropsWithChildren, ReactChildren, ReactElement, useEffect, useRef, useState } from 'react';
+import React, { ReactElement, useEffect, useRef, useState } from 'react';
 import { clamp } from '../../../Util';
 
 type PositionControllerType = {
@@ -32,7 +32,6 @@ const PositionController = (props: PositionControllerType) => {
     }
 
     useEffect(() => {
-        console.log({grabbed: props.grabbed})
         if (!props.grabbed) return;
         let grabPos: {x: number, y: number} | null = null;
 
@@ -56,7 +55,6 @@ const PositionController = (props: PositionControllerType) => {
             removeEventListener('mouseup', onRelease);
         }
 
-        console.log('should be able to move');
         addEventListener('mousemove', onMove);
         addEventListener('mouseup', onRelease);
     }, [props.grabbed]);

modules/main/src/components/GameSettingsComponent/components/SettingsButton.tsx

@@ -1,8 +1,5 @@
 import * as React from 'react';
-import styled from 'styled-components';
-import tw from 'twin.macro';
 import ReactDOM from 'react-dom';
-import { Theme } from '../../../../../shared/Theme';
 import { useEffect, useState } from 'react';
 import { StadiaSelectors } from '../../../StadiaSelectors';
 import StadiaPlusIcon from '../../../../../shared/resources/components/StadiaPlusIcon';

modules/main/src/state/StateStore.ts

@@ -1,4 +1,4 @@
-import { action, makeAutoObservable, observable } from 'mobx';
+import { action, makeAutoObservable, makeObservable, observable } from 'mobx';
 import { StadiaPage } from '../StadiaPage';
 
 export default class StateStore {
@@ -25,8 +25,4 @@ export default class StateStore {
     }
 }
 
-export type WithStore<T> = T & {
-    store: StateStore
-}
-
 export const stateStore = new StateStore();

modules/popup/src/Router.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Switch, Route, Link, HashRouter } from 'react-router-dom';
+import { Switch, Route, HashRouter } from 'react-router-dom';
 import OnboardPage from './pages/OnboardPage';
 import HomePage from './pages/HomePage';
 import SettingsPage from './pages/SettingsPage';

modules/popup/src/components/OnboardPanel.tsx

@@ -1,6 +1,4 @@
-import React, { ReactElement, MouseEvent } from 'react';
-import { CgArrowTopRight, CgGoogle } from 'react-icons/cg';
-import Container from './Container';
+import React, { ReactElement } from 'react';
 import styled from 'styled-components';
 import tw from 'twin.macro';
 import Button, { ButtonProps } from './Button';

modules/popup/src/components/ProfilePanel.tsx

@@ -1,9 +1,8 @@
 import React from 'react';
 import { CgArrowTopRight, CgProfile } from 'react-icons/cg';
-import Container from './Container';
 import styled from 'styled-components';
 import { Theme } from '../../../shared/Theme';
-import { StadiaPlusDB } from '../../../shared/StadiaPlusDB';
+import StadiaPlusDB from '../../../shared/StadiaPlusDB';
 import tw from 'twin.macro';
 
 interface ProfilePanelProps {

modules/popup/src/components/SettingsCategory.tsx

@@ -1,7 +1,6 @@
 import React, { PropsWithChildren } from 'react';
 import styled from 'styled-components';
 import tw from 'twin.macro';
-import { Theme } from '../../../shared/Theme';
 
 type SettingsCategoryProps = {
     title: string

modules/popup/src/components/settings/SwitchEntry.tsx

@@ -1,5 +1,4 @@
 import React from 'react';
-import Dropdown, { DropdownProps } from '../../../../shared/components/Dropdown';
 import styled from 'styled-components';
 import tw from 'twin.macro';
 import Switch, { SwitchProps } from '../../../../shared/components/Switch';

modules/popup/src/pages/HomePage.tsx

@@ -5,26 +5,22 @@ import {
     CgArrowTopRight, CgGames,
     CgGift,
     CgOptions,
-    CgProfile,
     CgSupport,
     CgSync,
 } from 'react-icons/cg';
 import OnboardPanel from '../components/OnboardPanel';
 import ProfilePanel from '../components/ProfilePanel';
-import { StadiaPlusDB } from '../../../shared/StadiaPlusDB';
-import Button from '../components/Button';
-import { FaPatreon } from 'react-icons/fa';
+import StadiaPlusDB, { Profile } from '../../../shared/StadiaPlusDB';
 import tw from 'twin.macro';
 import styled from 'styled-components';
 import { Theme } from '../../../shared/Theme';
 import { IoLogoGoogle } from 'react-icons/io';
 import { Config } from '../../../shared/Config';
-import Logger from '../../../shared/Logger';
 import { useHistory } from 'react-router-dom';
 
 
 export default function HomePage() {
-    const [profile, setProfile] = useState<StadiaPlusDB.Profile | null>(null);
+    const [profile, setProfile] = useState<Profile | null>(null);
     const [syncEnabled, setSyncEnabled] = useState<boolean>(false);
     const history = useHistory();
 

modules/popup/src/pages/OnboardPage.tsx

@@ -1,15 +1,13 @@
 import React, { useEffect, useState } from 'react';
 import styled from 'styled-components';
 import tw from 'twin.macro';
-import { Theme } from '../../../shared/Theme';
-import { CgArrowRight, CgArrowTopRight, CgClose, CgGoogle, CgSync } from 'react-icons/cg';
-import { FaGoogle } from 'react-icons/fa';
+import { CgArrowRight, CgArrowTopRight, CgSync } from 'react-icons/cg';
 import Container from '../components/Container';
 import OnboardPanel from '../components/OnboardPanel';
-import { StadiaPlusDB } from '../../../shared/StadiaPlusDB';
+import StadiaPlusDB from '../../../shared/StadiaPlusDB';
 import { useHistory } from 'react-router-dom';
 import Logger from '../../../shared/Logger';
-import set = chrome.cookies.set;
+
 import MDSpinner from 'react-md-spinner';
 import StadiaPlusLogo from '../../../shared/resources/components/StadiaPlusLogo';
 import { IoLogoGoogle } from 'react-icons/io';
@@ -104,7 +102,7 @@ export default function OnboardPage() {
 
     return <Container>
         <LogoWrapper>
-            <StadiaPlusLogo/>
+            <StadiaPlusLogo context={'popup'}/>
         </LogoWrapper>
         <PanelWrapper>
             { loaded

modules/popup/src/pages/SettingsPage.tsx

@@ -1,26 +1,6 @@
-import React, { useEffect, useState } from 'react';
+import React from 'react';
 import Container from '../components/Container';
-import {
-    CgArrowRight,
-    CgArrowTopRight, CgGames,
-    CgGift,
-    CgOptions,
-    CgProfile,
-    CgSupport,
-    CgSync,
-} from 'react-icons/cg';
-import OnboardPanel from '../components/OnboardPanel';
-import ProfilePanel from '../components/ProfilePanel';
-import { StadiaPlusDB } from '../../../shared/StadiaPlusDB';
-import Button from '../components/Button';
-import { FaPatreon } from 'react-icons/fa';
-import tw from 'twin.macro';
-import styled from 'styled-components';
-import { Theme } from '../../../shared/Theme';
-import { IoLogoGoogle } from 'react-icons/io';
 import { Config } from '../../../shared/Config';
-import Logger from '../../../shared/Logger';
-import { useHistory } from 'react-router-dom';
 import Header from '../components/Header';
 import SettingsCategory from '../components/SettingsCategory';
 import DropdownEntry from '../components/settings/DropdownEntry';