Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

style: apply formatter & improve import paths #254

Merged
merged 1 commit into from
Sep 26, 2023
+59 −44
Merged

style: apply formatter & improve import paths #254

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 4 additions & 0 deletions .vscode/settings.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
{
"editor.formatOnSave": true,
"editor.defaultFormatter": "esbenp.prettier-vscode"
}
2 changes: 1 addition & 1 deletion index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,6 @@
</head>
<body>
<div id="app"></div>
<script type="module" src="./src/index.jsx"></script>
<script type="module" src="./src/index.tsx"></script>
</body>
</html>
2 changes: 1 addition & 1 deletion postcss.config.cjs
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
module.exports = {
plugins: {
"postcss-nesting": {},
'postcss-nesting': {},
'tailwindcss/nesting': {},
tailwindcss: {},
autoprefixer: {},
Expand Down
5 changes: 3 additions & 2 deletions src/components/App.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,8 @@ function App() {

// Load feature definitions from API
fetch(
`https://cdn.growthbook.io/api/features/${import.meta.env.VITE_GROWTH_BOOK_KEY
`https://cdn.growthbook.io/api/features/${
import.meta.env.VITE_GROWTH_BOOK_KEY
}`,
)
.then((res) => res.json())
Expand All @@ -50,7 +51,7 @@ function App() {
return (
<GrowthBookProvider growthbook={growthbook}>
<Header />
{ location.pathname !== '/' && <Breadcrumbs /> }
{location.pathname !== '/' && <Breadcrumbs />}
<Alert message="" />
<Outlet />
</GrowthBookProvider>
Expand Down
36 changes: 20 additions & 16 deletions src/components/Breadcrumbs.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,24 +1,28 @@
import { useMatches } from "react-router-dom";
import { useMatches } from 'react-router-dom';

import classes from './breadcrumbs.module.css';

function Breadcrumbs() {
const matches = useMatches();
const crumbs = matches
// first get rid of any matches that don't have handle and crumb
.filter((match) => Boolean(match.handle?.crumb))
// now map them into an array of elements, passing the loader
// data to each one
.map((match) => match.handle.crumb(match.data));
const matches = useMatches();
const crumbs = matches
// first get rid of any matches that don't have handle and crumb
.filter((match) => Boolean(match.handle?.crumb))
// now map them into an array of elements, passing the loader
// data to each one
.map((match) => match.handle.crumb(match.data));

return (
<ol className={classes.breadcrumbs}>
{crumbs.map((crumb, index) => (
// eslint-disable-next-line react/no-array-index-key
<li className={classes.crumb} key={index}>{crumb}</li>
))}
</ol>
);
return (
<div className="container mx-auto px-4">
<ol className={classes.breadcrumbs}>
{crumbs.map((crumb, index) => (
// eslint-disable-next-line react/no-array-index-key
<li className={classes.crumb} key={index}>
{crumb}
</li>
))}
</ol>
</div>
);
}

export default Breadcrumbs;
22 changes: 11 additions & 11 deletions src/components/breadcrumbs.module.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,18 +1,18 @@
.breadcrumbs {
display: flex;
flex-direction: row;
gap: .4rem;
display: flex;
flex-direction: row;
gap: 0.4rem;
}

.crumb {
&::after {
content: '>';
margin-left: .4rem;
}
&::after {
content: '>';
margin-left: 0.4rem;
}

&:last-child {
&::after {
content: '';
}
&:last-child {
&::after {
content: '';
}
}
}
12 changes: 6 additions & 6 deletions src/index.jsx → src/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,13 +5,13 @@ import { createBrowserRouter, RouterProvider, Link } from 'react-router-dom';
import './index.css';

const App = lazy(() => import('@components/App'));
const Home = lazy(() => import('./pages'));
const NoMatch = lazy(() => import('./pages/[all]'));
const Home = lazy(() => import('@pages/index'));
const NoMatch = lazy(() => import('@pages/[all]'));

const NewPost = lazy(() => import('./pages/posts/new'));
const EditPost = lazy(() => import('./pages/posts/[postId]/edit'));
const UserInfo = lazy(() => import('./pages/users/[userName]'));
const BlogPost = lazy(() => import('./pages/posts/[postId]'));
const NewPost = lazy(() => import('@pages/posts/new'));
const BlogPost = lazy(() => import('@pages/posts/[postId]'));
const EditPost = lazy(() => import('@pages/posts/[postId]/edit'));
const UserInfo = lazy(() => import('@pages/users/[userName]'));

const root = createRoot(document.getElementById('app'));

Expand Down
8 changes: 4 additions & 4 deletions src/pages/[all].tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,14 +1,14 @@
import {
useLocation
} from "react-router-dom";
import { useLocation } from 'react-router-dom';

function NoMatch() {
const location = useLocation();

return (
<div className="container mx-auto px-4">
<h1 className="text-center mt-3">404</h1>
<p>No match for <code>{location.pathname}</code></p>
<p>
No match for <code>{location.pathname}</code>
</p>
</div>
);
}
Expand Down
1 change: 1 addition & 0 deletions tsconfig.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,6 +31,7 @@
// "baseUrl": "./", /* Specify the base directory to resolve non-relative module names. */
"paths": {
"@components/*": ["./src/components/*"],
"@pages/*": ["./src/pages/*"],
"@services/*": ["./src/services/*"]
}, /* Specify a set of entries that re-map imports to additional lookup locations. */
// "rootDirs": [], /* Allow multiple folders to be treated as one when resolving modules. */
Expand Down
11 changes: 8 additions & 3 deletions vite.config.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,10 @@ import { VitePWA } from 'vite-plugin-pwa';
// const path = require('node:path');

export default defineConfig({
base: process.env.NODE_ENV === 'production' ? '/local-microblogging-client/' : '/',
base:
process.env.NODE_ENV === 'production'
? '/local-microblogging-client/'
: '/',
build: {
emptyOutDir: true,
},
Expand All @@ -27,12 +30,14 @@ export default defineConfig({
alias: [
{
find: '@components',
// replacement: path.resolve(__dirname, './src'),
replacement: '/src/components',
},
{
find: '@pages',
replacement: '/src/pages',
},
{
find: '@services',
// replacement: path.resolve(__dirname, './src'),
replacement: '/src/services',
},
],
Expand Down
Loading