feat: routes fix

jsconfig.json

@@ -3,7 +3,8 @@
     "types": ["vitest/globals"],
     "baseUrl": ".",
     "paths": {
-      "@testing-library/vanilla": ["src/__tests__/index.js"]
+      "@testing-library/vanilla": ["src/__tests__/index.js"],
+      "~src/*": ["src/*"]
     }
   }
 }

package.json

@@ -57,6 +57,7 @@
     "eslint": "^8.57.0",
     "eslint-config-airbnb": "^19.0.4",
     "eslint-config-prettier": "^9.1.0",
+    "eslint-import-resolver-alias": "1.1.2",
     "eslint-import-resolver-jsconfig": "1.1.0",
     "eslint-import-resolver-node": "0.3.9",
     "eslint-plugin-import": "^2.29.1",

src/layouts/app/components/SideMenu/index.js

@@ -34,12 +34,32 @@ const html = `
       <div class="side-menu-content__line"></div>
       <div class="side-menu-content__itens" alt="itens-um">
         <ul class="side-menu-content__ul" data-select="menuitens">
-          <li><a data-vanilla-route-link="spa" class="side-menu-content__menuitens" href="/app/pets"><img src="${meusPets}" alt="Meus Pets">Meus Pets</a></li>
-          <li><a data-vanilla-route-link="spa" class="side-menu-content__menuitens" href="/app/pet-dex"><img src="${petdex}" alt="Pet Dex">Pet Dex</a></li>
-          <li><a data-vanilla-route-link="spa" class="side-menu-content__menuitens" href="/app/donates"><img src="${doacoes}" alt="Doacoes">Doações</a></li>
+          <li>
+            <a data-vanilla-route-link="spa" class="side-menu-content__menuitens" href="/">
+              <img src="${meusPets}" alt="Meus Pets">Meus Pets
+            </a>
+          </li>
+          <li>
+            <a data-vanilla-route-link="spa" class="side-menu-content__menuitens" href="/pet-dex">
+              <img src="${petdex}" alt="Pet Dex">Pet Dex
+            </a>
+          </li>
+          <li>
+            <a data-vanilla-route-link="spa" class="side-menu-content__menuitens" href="/donates">
+              <img src="${doacoes}" alt="Doacoes">Doações
+            </a>
+          </li>
           <hr class="side-menu-content__lineinside"/>
-          <li><a data-vanilla-route-link="spa" class="side-menu-content__menuitens" href="/app/account"><img src="${conta}" alt="conta">Conta</a></li>
-          <li><a data-vanilla-route-link="spa" class="side-menu-content__menuitens" href="/app/settings"><img src="${configuracoes}" alt="configuracoes">Configurações</a></li>
+          <li>
+            <a data-vanilla-route-link="spa" class="side-menu-content__menuitens" href="/account">
+              <img src="${conta}" alt="conta">Conta
+            </a>
+          </li>
+          <li>
+            <a data-vanilla-route-link="spa" class="side-menu-content__menuitens" href="/settings">
+              <img src="${configuracoes}" alt="configuracoes">Configurações
+            </a>
+          </li>
         </ul>
       </div>
     </div>

src/router/main-router.js

@@ -1,13 +1,15 @@
 import { BrowserRoute } from 'vanilla-routing';
-import addPet from './routes/add-pet/add-pet';
-import mainRoutes from './routes/main-routes/main-routes';
-import myPets from './routes/my-pets/my-pets';
+import addPet from './routes/app/add-pet/add-pet';
+import mainRoutes from './routes/app/main-routes/main-routes';
+import myPets from './routes/app/my-pets/my-pets';
+import account from './routes/create-account/account'; //
 
 export default function mainRouter() {
   const routes = [
     ...Object.values(mainRoutes),
     ...Object.values(myPets),
     ...Object.values(addPet),
+    ...Object.values(account), //
   ];
 
   BrowserRoute(routes);

src/router/routes/add-pet/steps/birthday.js → src/router/routes/app/add-pet/steps/birthday.js

@@ -1,7 +1,7 @@
-import NoPetRegirestedPage from '../../../../layouts/app/pages/NoPetRegirested';
+import NoPetRegirestedPage from '~src/layouts/app/pages/NoPetRegirested';
 
 export default {
-  pathname: '/app/pet-birthday',
+  pathname: '/pet-birthday',
   element: () => {
     const $content = document.createElement('div');
     $content.classList.add('home__content-page');

src/router/routes/add-pet/steps/name.js → src/router/routes/app/add-pet/steps/name.js

@@ -1,7 +1,7 @@
-import NoPetRegirestedPage from '../../../../layouts/app/pages/NoPetRegirested';
+import NoPetRegirestedPage from '~src/layouts/app/pages/NoPetRegirested';
 
 export default {
-  pathname: '/app/pet-name',
+  pathname: '/pet-name',
   element: () => {
     const $content = document.createElement('div');
     $content.classList.add('home__content-page');

src/router/routes/add-pet/steps/petvet.js → src/router/routes/app/add-pet/steps/petvet.js

@@ -1,7 +1,7 @@
-import NoPetRegirestedPage from '../../../../layouts/app/pages/NoPetRegirested';
+import NoPetRegirestedPage from '~src/layouts/app/pages/NoPetRegirested';
 
 export default {
-  pathname: '/app/pet-vet',
+  pathname: '/pet-vet',
   element: () => {
     const $content = document.createElement('div');
     $content.classList.add('home__content-page');

src/router/routes/add-pet/steps/race.js → src/router/routes/app/add-pet/steps/race.js

@@ -1,7 +1,7 @@
-import NoPetRegirestedPage from '../../../../layouts/app/pages/NoPetRegirested';
+import NoPetRegirestedPage from '~src/layouts/app/pages/NoPetRegirested';
 
 export default {
-  pathname: '/app/pet-race',
+  pathname: '/pet-race',
   element: () => {
     const $content = document.createElement('div');
     $content.classList.add('home__content-page');

src/router/routes/add-pet/steps/register.js → src/router/routes/app/add-pet/steps/register.js

@@ -1,7 +1,7 @@
-import NoPetRegirestedPage from '../../../../layouts/app/pages/NoPetRegirested';
+import NoPetRegirestedPage from '~src/layouts/app/pages/NoPetRegirested';
 
 export default {
-  pathname: '/app/pet-register',
+  pathname: '/pet-register',
   element: () => {
     const $content = document.createElement('div');
     $content.classList.add('home__content-page');

src/router/routes/add-pet/steps/size.js → src/router/routes/app/add-pet/steps/size.js

@@ -1,7 +1,7 @@
-import NoPetRegirestedPage from '../../../../layouts/app/pages/NoPetRegirested';
+import NoPetRegirestedPage from '~src/layouts/app/pages/NoPetRegirested';
 
 export default {
-  pathname: '/app/pet-size',
+  pathname: '/pet-size',
   element: () => {
     const $content = document.createElement('div');
     $content.classList.add('home__content-page');

src/router/routes/add-pet/steps/weight.js → src/router/routes/app/add-pet/steps/weight.js

@@ -1,7 +1,7 @@
-import NoPetRegirestedPage from '../../../../layouts/app/pages/NoPetRegirested';
+import NoPetRegirestedPage from '~src/layouts/app/pages/NoPetRegirested';
 
 export default {
-  pathname: '/app/pet-weight',
+  pathname: '/pet-weight',
   element: () => {
     const $content = document.createElement('div');
     $content.classList.add('home__content-page');

src/router/routes/main-routes/routes/account.js → src/router/routes/app/main-routes/routes/account.js

@@ -1,7 +1,7 @@
-import NoPetRegirestedPage from '../../../../layouts/app/pages/NoPetRegirested';
+import NoPetRegirestedPage from '~src/layouts/app/pages/NoPetRegirested';
 
 export default {
-  pathname: '/app/account',
+  pathname: '/account',
   element: () => {
     const $content = document.createElement('div');
     $content.classList.add('home__content-page');

src/router/routes/main-routes/routes/donates.js → src/router/routes/app/main-routes/routes/donates.js

@@ -1,7 +1,7 @@
-import NoPetRegirestedPage from '../../../../layouts/app/pages/NoPetRegirested';
+import NoPetRegirestedPage from '~src/layouts/app/pages/NoPetRegirested';
 
 export default {
-  pathname: '/app/donates',
+  pathname: '/donates',
   element: () => {
     const $content = document.createElement('div');
     $content.classList.add('home__content-page');

src/router/routes/main-routes/routes/error.js → src/router/routes/app/main-routes/routes/error.js

@@ -1,4 +1,4 @@
-import NoPetRegirestedPage from '../../../../layouts/app/pages/NoPetRegirested';
+import NoPetRegirestedPage from '~src/layouts/app/pages/NoPetRegirested';
 
 export default {
   pathname: '*',

src/router/routes/main-routes/routes/home.js → src/router/routes/app/main-routes/routes/home.js

@@ -1,7 +1,7 @@
-import NoPetRegirestedPage from '../../../../layouts/app/pages/NoPetRegirested';
+import NoPetRegirestedPage from '~src/layouts/app/pages/NoPetRegirested';
 
 export default {
-  pathname: '/app/',
+  pathname: '/',
   element: () => {
     const $content = document.createElement('div');
     $content.classList.add('home__content-page');

src/router/routes/main-routes/routes/pet-dex.js → src/router/routes/app/main-routes/routes/pet-dex.js

@@ -1,7 +1,7 @@
-import NoPetRegirestedPage from '../../../../layouts/app/pages/NoPetRegirested';
+import NoPetRegirestedPage from '~src/layouts/app/pages/NoPetRegirested';
 
 export default {
-  pathname: '/app/pet-dex',
+  pathname: '/pet-dex',
   element: () => {
     const $content = document.createElement('div');
     $content.classList.add('home__content-page');

src/router/routes/main-routes/routes/settings.js → src/router/routes/app/main-routes/routes/settings.js

@@ -1,7 +1,7 @@
-import NoPetRegirestedPage from '../../../../layouts/app/pages/NoPetRegirested';
+import NoPetRegirestedPage from '~src/layouts/app/pages/NoPetRegirested';
 
 export default {
-  pathname: '/app/settings',
+  pathname: '/settings',
   element: () => {
     const $content = document.createElement('div');
     $content.classList.add('home__content-page');

src/router/routes/my-pets/steps/pet-profile.js → src/router/routes/app/my-pets/steps/pet-profile.js

@@ -1,7 +1,7 @@
-import NoPetRegirestedPage from '../../../../layouts/app/pages/NoPetRegirested';
+import NoPetRegirestedPage from '~src/layouts/app/pages/NoPetRegirested';
 
 export default {
-  pathname: '/app/pet-profile',
+  pathname: '/pet-profile',
   element: () => {
     const $content = document.createElement('div');
     $content.classList.add('home__content-page');

src/router/routes/my-pets/steps/pets.js → src/router/routes/app/my-pets/steps/pets.js

@@ -1,7 +1,7 @@
-import NoPetRegirestedPage from '../../../../layouts/app/pages/NoPetRegirested';
+import NoPetRegirestedPage from '~src/layouts/app/pages/NoPetRegirested';
 
 export default {
-  pathname: '/app/pets',
+  pathname: '/pets',
   element: () => {
     const $content = document.createElement('div');
     $content.classList.add('home__content-page');

src/router/routes/create-account/account.js

@@ -0,0 +1,5 @@
+import createAccount from './create-account';
+
+export default {
+  createAccount,
+};

src/router/routes/create-account/create-account.js

@@ -0,0 +1,13 @@
+import NoPetRegirestedPage from '~src/layouts/app/pages/NoPetRegirested';
+
+export default {
+  pathname: '/account/create-account',
+  element: () => {
+    const $content = document.createElement('div');
+    $content.classList.add('home__content-page');
+    $content.style.backgroundColor = 'orange';
+    const noPetRegirestedPage = new NoPetRegirestedPage();
+    noPetRegirestedPage.mount($content);
+    return $content;
+  },
+};

vite.config.js

@@ -6,7 +6,7 @@ import jsconfigPaths from 'vite-jsconfig-paths';
 import { VitePWA } from 'vite-plugin-pwa';
 
 export default defineConfig({
-  root: resolve(__dirname, 'src/layouts'),
+  root: resolve(__dirname, 'src/layouts/app'),
   define: {
     __isBrowser__: true,
   },
@@ -33,14 +33,14 @@ export default defineConfig({
     outDir: resolve(__dirname, 'dist'),
     rollupOptions: {
       input: {
-        index: resolve(__dirname, 'src/layouts/index.html'),
-        home: resolve(__dirname, 'src/layouts/app/index.html'),
+        index: resolve(__dirname, 'src/layouts/app/index.html'),
       },
     },
   },
   resolve: {
     alias: {
       '~styles': resolve(__dirname, 'src/styles'),
+      '~src': resolve(__dirname, 'src'),
     },
   },
   plugins: [