https://github.com/sohanemon/mama-john
https://github.com/sohanemon/mama-john
localstorage react tailwindcss
Last synced: about 2 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/sohanemon/mama-john
- Owner: sohanemon
- Created: 2022-09-27T18:02:12.000Z (over 3 years ago)
- Default Branch: master
- Last Pushed: 2022-11-07T18:15:12.000Z (over 3 years ago)
- Last Synced: 2025-09-03T22:41:13.699Z (9 months ago)
- Topics: localstorage, react, tailwindcss
- Language: JavaScript
- Homepage: https://mama-john.netlify.app
- Size: 3.62 MB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
## Back to home route
```js
if (window.location.pathname !== "/") window.location.pathname = "/";
```
> go to route page at any cost. Alternative to Netlify's \_redirects
## Deal firebase error
```js
export const sliceError = (error) => {
return error.message.split("/")[1].split(")")[0].replaceAll("-", " ");
};
```
## Avoid too much useContext Definition
```js
// working directory
import { useContext } from "react";
import { UserContext } from "./user-provider";
const { loginWithGoogle } = useContext(UserContext);
```
use as follow
```js
// root directory
const useUser = () => useContext(UserContext);
// working directory
const { loginWithGoogle } = useUser();
```
## Redirect to previous path after private route
- navigate with state & replace
```js
//private route.jsx
const PrivateRoute = ({ children }) => {
const { pathname } = useLocation();
if (user?.uid) return children;
return ;
// navigated from pathname
// passing a props named state
};
```
> state props will be injected to the location of `/login`
- get the pathname
```js
// login.jsx
const {
state: { pathname },
} = useLocation();
// or
const location = useLocation();
const pathname = location?.state?.pathname;
```
- now we know the previous location and go with
```js
//login.jsx
setTimeout(() => navigate(pathname || "/"), 100);
```
# Codemon
> absolute content takes `width: max-content` automatically