fix: reorganized components

.storybook/preview.js

@@ -1,6 +1,6 @@
 import Vue from 'vue';
 import Vuetify from 'vuetify';
-import { options } from '@/plugins/vuetify';
+import { options } from '~plugins/vuetify';
 import 'vuetify/dist/vuetify.min.css';
 import './storybook.css';
 

src/App.vue

@@ -9,8 +9,8 @@
 </template>
 
 <script>
-import TheHeader from '@/components/TheHeader.vue';
-import TheFooter from '@/components/TheFooter.vue';
+import TheHeader from '~core/components/TheHeader.vue';
+import TheFooter from '~core/components/TheFooter.vue';
 
 export default {
   components: {

src/components/RulesDialog.vue → src/core/components/RulesDialog.vue

@@ -180,7 +180,7 @@
 </template>
 
 <script>
-import BaseDialog from '@/components/Global/BaseDialog.vue';
+import BaseDialog from '~core/components/BaseDialog.vue';
 
 export default {
   name: 'RulesDialog',

src/components/StatsScoringDialog.vue → src/core/components/StatsScoringDialog.vue

@@ -89,8 +89,8 @@
 </template>
 
 <script>
-import BaseDialog from '@/components/Global/BaseDialog.vue';
-import AwardCard from '@/components/AwardCard.vue';
+import BaseDialog from '~core/components/BaseDialog.vue';
+import AwardCard from '~core/components/AwardCard.vue';
 
 export default {
   name: 'StatsScoringDialog',

src/components/TheFooter.vue → src/core/components/TheFooter.vue

@@ -26,7 +26,7 @@
 </template>
 
 <script setup>
-import { getPageLinks } from '@/composables/navLink.js';
+import { getPageLinks } from '~core/composables/navLink.js';
 
 const pageLinks = getPageLinks();
 </script>

src/components/TheHeader.vue → src/core/components/TheHeader.vue

@@ -39,8 +39,8 @@
 </template>
 
 <script setup>
-import { getPageLinks } from '@/composables/navLink.js';
-import TheUserMenu from './TheUserMenu.vue';
+import { getPageLinks } from '~core/composables/navLink.js';
+import TheUserMenu from '~core/components/TheUserMenu.vue';
 import { useDisplay } from 'vuetify';
 
 const { mobile } = useDisplay();

src/main.js

@@ -1,8 +1,8 @@
 import { createApp } from 'vue';
 
-import vuetify from '@/plugins/vuetify';
+import vuetify from '~plugins/vuetify';
 import router from '@/router';
-import store from '@/store/store';
+import store from '~store/store';
 import i18n from '@/i18n';
 import { initCuttleGlobals } from '_/utils/config-utils';
 

src/plugins/sails.js

@@ -1,14 +1,14 @@
 import sails from 'sails.io.js';
 import socketIoClient from 'socket.io-client';
-import { handleInGameEvents } from './sockets/inGameEvents';
+import { handleInGameEvents } from '~plugins/sockets/inGameEvents';
 import {
   handleGameStarted,
   handleGameCreated,
   handleGameFinished,
   handleJoin,
   handleLeftGame,
-} from './sockets/gameListEvents';
-import { handleConnect } from './sockets/connectivityEvents';
+} from '~plugins/sockets/gameListEvents';
+import { handleConnect } from '~plugins/sockets/connectivityEvents';
 
 export const io = sails(socketIoClient);
 

src/plugins/sockets/connectivityEvents.js

@@ -1,4 +1,4 @@
-import store from '@/store/store.js';
+import store from '~store/store.js';
 import router from '@/router.js';
 import { ROUTE_NAME_GAME, ROUTE_NAME_SPECTATE, ROUTE_NAME_HOME } from '@/router';
 

src/plugins/sockets/gameListEvents.js

@@ -1,4 +1,4 @@
-import store from '@/store/store.js';
+import store from '~store/store.js';
 import { cloneDeep } from 'lodash';
 
 export function handleGameCreated(evData) {

src/plugins/sockets/inGameEvents.js

@@ -1,7 +1,7 @@
-import store from '@/store/store.js';
+import store from '~store/store.js';
 import router from '@/router.js';
 import { ROUTE_NAME_GAME, ROUTE_NAME_SPECTATE, ROUTE_NAME_LOBBY } from '@/router';
-import SocketEvent from '../../../types/SocketEvent';
+import SocketEvent from '_/types/SocketEvent';
 
 // Handles socket updates of game data
 export async function handleInGameEvents(evData) {

src/router.js

@@ -1,13 +1,5 @@
 import { createRouter, createWebHashHistory } from 'vue-router';
-
-
-import HomeView from '@/views/HomeView.vue';
-import LoginView from '@/views/LoginView.vue';
-import LobbyView from '@/views/LobbyView.vue';
-import GameView from '@/views/GameView.vue';
-import RulesView from '@/views/RulesView.vue';
-import StatsView from '@/views/StatsView.vue';
-import store from '@/store/store.js';
+import store from '~store/store.js';
 
 export const ROUTE_NAME_GAME = 'Game';
 export const ROUTE_NAME_SPECTATE = 'Spectate';
@@ -40,18 +32,18 @@ const routes = [
   {
     path: '/',
     name: 'Home',
-    component: HomeView,
+    component: () => import('@/routes/home/HomeView.vue'),
     beforeEnter: mustBeAuthenticated,
   },
   {
     path: '/login',
     name: ROUTE_NAME_LOGIN,
-    component: LoginView,
+    component: () => import('@/routes/auth/LoginView.vue'),
   },
   {
     path: '/signup',
     name: ROUTE_NAME_SIGNUP,
-    component: LoginView,
+    component: () => import('@/routes/auth/LoginView.vue'),
   },
   // This route is just a passthrough to make sure the user is fully logged out before putting
   // them on the login screen
@@ -63,12 +55,12 @@ const routes = [
   {
     path: '/rules',
     name: ROUTE_NAME_RULES,
-    component: RulesView,
+    component: () => import('@/routes/rules/RulesView.vue'),
   },
   {
     name: ROUTE_NAME_LOBBY,
     path: '/lobby/:gameId',
-    component: LobbyView,
+    component: () => import('@/routes/lobby/LobbyView.vue'),
     // TODO: Add logic to redirect if a given game does not exist
     beforeEnter: mustBeAuthenticated,
     meta: {
@@ -78,7 +70,7 @@ const routes = [
   {
     name: ROUTE_NAME_GAME,
     path: '/game/:gameId',
-    component: GameView,
+    component: () => import('@/routes/game/GameView.vue'),
     // TODO: Add logic to redirect if a given game does not exist
     // mustBeAuthenticated intentionally left off here
     // If a user refreshes the relogin modal will fire and allow them to continue playing
@@ -89,21 +81,21 @@ const routes = [
   {
     name: ROUTE_NAME_SPECTATE,
     path: '/spectate/:gameId',
-    component: GameView,
+    component: () => import('@/routes/game/GameView.vue'),
     meta: {
       hideNavigation: true,
     },
   },
   {
     path: '/stats',
     name: ROUTE_NAME_STATS,
-    component: StatsView,
+    component: () => import('@/routes/stats/StatsView.vue'),
     beforeEnter: mustBeAuthenticated,
   },
   {
     path: '/stats/:seasonId',
     name: ROUTE_NAME_STATS_SEASON,
-    component: StatsView,
+    component: () => import('@/routes/stats/StatsView.vue'),
     beforeEnter: mustBeAuthenticated,
   },
 ];

src/views/LoginView.vue → src/routes/auth/LoginView.vue

@@ -170,9 +170,9 @@
 import { useI18n } from 'vue-i18n';
 
 import { ROUTE_NAME_LOGIN, ROUTE_NAME_SIGNUP } from '@/router';
-import BaseSnackbar from '@/components/Global/BaseSnackbar.vue';
-import MarkdownContent from '@/components/Global/MarkdownContent.vue';
-import BaseVideo from '../components/Global/BaseVideo.vue';
+import BaseSnackbar from '~core/components/BaseSnackbar.vue';
+import MarkdownContent from '~core/components/MarkdownContent.vue';
+import BaseVideo from '~core/components/BaseVideo.vue';
 
 export default {
   name: 'LoginView',

src/views/GameView.vue → src/routes/game/GameView.vue

@@ -396,17 +396,17 @@
 import { mapGetters, mapState } from 'vuex';
 
 import { ROUTE_NAME_HOME, ROUTE_NAME_SPECTATE } from '@/router';
-import GameCard from '@/components/GameView/GameCard.vue';
-import GameDialogs from '@/components/GameView/GameDialogs.vue';
-import GameMenu from '@/components/GameView/GameMenu.vue';
-import GameOverlays from '@/components/GameView/GameOverlays.vue';
-import ScoreGoalToolTip from '@/components/GameView/ScoreGoalToolTip.vue';
-import GameUnavailableView from '../components/GameView/GameUnavailableView.vue';
-import TargetSelectionOverlay from '@/components/GameView/TargetSelectionOverlay.vue';
-import ScrapDialog from '@/components/GameView/ScrapDialog.vue';
-import UsernameToolTip from '@/components/GameView/UsernameToolTip.vue';
-import BaseSnackbar from '@/components/Global/BaseSnackbar.vue';
-import SpectatorListMenu from '../components/GameView/SpectatorListMenu.vue';
+import BaseSnackbar from '~core/components/BaseSnackbar.vue';
+import UsernameToolTip from '~core/components/UsernameToolTip.vue';
+import GameCard from '~routes/game/components/GameCard.vue';
+import GameDialogs from '~routes/game/components/GameDialogs.vue';
+import GameMenu from '~routes/game/components/GameMenu.vue';
+import GameOverlays from '~routes/game/components/GameOverlays.vue';
+import ScoreGoalToolTip from '~routes/game/components/ScoreGoalToolTip.vue';
+import GameUnavailableView from '~routes/game/components/GameUnavailableView.vue';
+import TargetSelectionOverlay from '~routes/game/components/TargetSelectionOverlay.vue';
+import ScrapDialog from '~routes/game/components/ScrapDialog.vue';
+import SpectatorListMenu from '~routes/game/components/SpectatorListMenu.vue';
 
 export default {
   name: 'GameView',

src/components/GameView/CannotCounterDialog.vue → src/routes/game/components/CannotCounterDialog.vue

@@ -57,9 +57,9 @@
 </template>
 
 <script>
-import BaseDialog from '@/components/Global/BaseDialog.vue';
-import GameCard from '@/components/GameView/GameCard.vue';
-import GameCardName from '@/components/GameView/GameCardName.vue';
+import BaseDialog from '~core/components/BaseDialog.vue';
+import GameCard from '~routes/game/components/GameCard.vue';
+import GameCardName from '~routes/game/components/GameCardName.vue';
 
 export default {
   name: 'CannotCounterDialog',

src/components/GameView/CardListSortable.vue → src/routes/game/components/CardListSortable.vue

@@ -36,7 +36,7 @@
 </template>
 
 <script>
-import GameCard from '@/components/GameView/GameCard.vue';
+import GameCard from '~routes/game/components/GameCard.vue';
 import { orderBy } from 'lodash';
 
 export default {

src/components/GameView/ChooseTwoDialog.vue → src/routes/game/components/ChooseTwoDialog.vue

@@ -34,8 +34,8 @@
 </template>
 
 <script>
-import GameCard from '@/components/GameView/GameCard.vue';
-import BaseDialog from '@/components/Global/BaseDialog.vue';
+import GameCard from '~routes/game/components/GameCard.vue';
+import BaseDialog from '~core/components/BaseDialog.vue';
 
 export default {
   name: 'ChooseTwoDialog',

src/components/GameView/ChooseWhetherToCounterDialog.vue → src/routes/game/components/ChooseWhetherToCounterDialog.vue

@@ -58,9 +58,9 @@
 </template>
 
 <script>
-import BaseDialog from '@/components/Global/BaseDialog.vue';
-import GameCard from '@/components/GameView/GameCard.vue';
-import GameCardName from '@/components/GameView/GameCardName.vue';
+import BaseDialog from '~core/components/BaseDialog.vue';
+import GameCard from '~routes/game/components/GameCard.vue';
+import GameCardName from '~routes/game/components/GameCardName.vue';
 
 export default {
   name: 'ChooseWhetherToCounterDialog',

src/components/GameView/CounterDialog.vue → src/routes/game/components/CounterDialog.vue

@@ -22,8 +22,8 @@
 </template>
 
 <script>
-import ChooseWhetherToCounterDialog from './ChooseWhetherToCounterDialog.vue';
-import ChooseTwoDialog from './ChooseTwoDialog.vue';
+import ChooseWhetherToCounterDialog from '~routes/game/components/ChooseWhetherToCounterDialog.vue';
+import ChooseTwoDialog from '~routes/game/components/ChooseTwoDialog.vue';
 
 export default {
   name: 'CounterDialog',

src/components/GameView/FourDialog.vue → src/routes/game/components/FourDialog.vue

@@ -33,8 +33,8 @@
 </template>
 
 <script>
-import BaseDialog from '@/components/Global/BaseDialog.vue';
-import GameCard from '@/components/GameView/GameCard.vue';
+import BaseDialog from '~core/components/BaseDialog.vue';
+import GameCard from '~routes/game/components/GameCard.vue';
 
 export default {
   name: 'FourDialog',

src/components/GameView/GameDialogs.vue → src/routes/game/components/GameDialogs.vue

@@ -46,14 +46,14 @@
 import { mapGetters } from 'vuex';
 import { mapState } from 'vuex';
 
-import CannotCounterDialog from '@/components/GameView/CannotCounterDialog.vue';
-import CounterDialog from '@/components/GameView/CounterDialog.vue';
-import FourDialog from '@/components/GameView/FourDialog.vue';
-import GameOverDialog from '@/components/GameView/GameOverDialog.vue';
-import ReauthenticateDialog from '@/components/GameView/ReauthenticateDialog.vue';
-import SevenDoubleJacksDialog from '@/components/GameView/SevenDoubleJacksDialog.vue';
-import ThreeDialog from '@/components/GameView/ThreeDialog.vue';
-import OpponentRequestedStalemateDialog from './OpponentRequestedStalemateDialog.vue';
+import CannotCounterDialog from '~routes/game/components/CannotCounterDialog.vue';
+import CounterDialog from '~routes/game/components/CounterDialog.vue';
+import FourDialog from '~routes/game/components/FourDialog.vue';
+import GameOverDialog from '~routes/game/components/GameOverDialog.vue';
+import ReauthenticateDialog from '~routes/game/components/ReauthenticateDialog.vue';
+import SevenDoubleJacksDialog from '~routes/game/components/SevenDoubleJacksDialog.vue';
+import ThreeDialog from '~routes/game/components/ThreeDialog.vue';
+import OpponentRequestedStalemateDialog from '~routes/game/components/OpponentRequestedStalemateDialog.vue';
 
 export default {
   name: 'GameDialogs',

src/components/GameView/GameMenu.vue → src/routes/game/components/GameMenu.vue

@@ -69,8 +69,8 @@
 </template>
 
 <script>
-import BaseDialog from '@/components/Global/BaseDialog.vue';
-import RulesDialog from '@/components/RulesDialog.vue';
+import BaseDialog from '~core/components/BaseDialog.vue';
+import RulesDialog from '~core/components/RulesDialog.vue';
 export default {
   name: 'GameMenu',
   components: {

src/components/GameView/GameOverDialog.vue → src/routes/game/components/GameOverDialog.vue

@@ -67,8 +67,8 @@
 
 <script>
 import { mapGetters, mapState } from 'vuex';
-import BaseDialog from '@/components/Global/BaseDialog.vue';
-import GameStatus from '../../../utils/GameStatus.json';
+import BaseDialog from '~core/components/BaseDialog.vue';
+import GameStatus from '_/utils/GameStatus.json';
 
 export default {
   name: 'GameOverDialog',

src/components/GameView/GameOverlays.vue → src/routes/game/components/GameOverlays.vue

@@ -124,8 +124,8 @@
 <script>
 import { mapGetters, mapState } from 'vuex';
 
-import MoveChoiceOverlay from '@/components/GameView/MoveChoiceOverlay.vue';
-import GameCard from '@/components/GameView/GameCard.vue';
+import MoveChoiceOverlay from '~routes/game/components/MoveChoiceOverlay.vue';
+import GameCard from '~routes/game/components/GameCard.vue';
 
 export default {
   name: 'GameOverlays',

src/components/GameView/GameUnavailableView.vue → src/routes/game/components/GameUnavailableView.vue

@@ -12,8 +12,8 @@
 </template>
 
 <script>
-import ReauthenticateDialog from '@/components/GameView/ReauthenticateDialog.vue';
-import GameUnavailableOverlay from './GameUnavailableOverlay.vue';
+import ReauthenticateDialog from '~routes/game/components/ReauthenticateDialog.vue';
+import GameUnavailableOverlay from '~routes/game/components/GameUnavailableOverlay.vue';
 
 export default {
   name: 'GameUnavailable',

src/components/GameView/MoveChoiceOverlay.vue → src/routes/game/components/MoveChoiceOverlay.vue

@@ -44,8 +44,8 @@
 </template>
 
 <script>
-import MoveChoiceCard from '@/components/GameView/MoveChoiceCard.vue';
-import GameCard from '@/components/GameView/GameCard.vue';
+import MoveChoiceCard from '~routes/game/components/MoveChoiceCard.vue';
+import GameCard from '~routes/game/components/GameCard.vue';
 
 export default {
   name: 'MoveChoiceOverlay',

src/components/GameView/OpponentRequestedStalemateDialog.vue → src/routes/game/components/OpponentRequestedStalemateDialog.vue

@@ -35,7 +35,7 @@
 </template>
 
 <script>
-import BaseDialog from '@/components/Global/BaseDialog.vue';
+import BaseDialog from '~core/components/BaseDialog.vue';
 
 export default {
   name: 'OpponentRequestedStalemateDialog',