Kais3rP

/* http://meyerweb.com/eric/tools/css/reset/
   v2.0-modified | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,

Kais3rP

Composing <Route> in React Router v6

Composition of <Route> elements in React Router is changing in v6 from how it worked in v4/5 and in Reach Router. React Router v6 is the successor of both React Router v5 and Reach Router.

This document explains our rationale for making the change as well as a pattern you will want to avoid in v6 and a note on how you can start preparing your v5 app for v6 today.

Background

In React Router v5, we had an example of how you could create a element](https://github.com/remix-run/react-router/blob/320be7afe44249d5c025659bc00c3276a19f0af9/packages/react-router-dom/examples/Auth.js#L50-L52) to restrict access to certain routes on the page. This element was a simple [wrapper around an actual element that made a simple decision: is the user authenticated or not? If so, ren

Kais3rP

Commit Message Guidelines

We have very precise rules over how our git commit messages can be formatted. This leads to more readable messages that are easy to follow when looking through the project history. But also, we use the git commit messages to generate the Angular change log.

Commit Message Format

Each commit message consists of a header, a body and a footer. The header has a special format that includes a type, a scope and a subject:

Kais3rP

Code is clean if it can be understood easily – by everyone on the team. Clean code can be read and enhanced by a developer other than its original author. With understandability comes readability, changeability, extensibility and maintainability.

---

General rules

1. Follow standard conventions.
2. Keep it simple stupid. Simpler is always better. Reduce complexity as much as possible.
3. Boy scout rule. Leave the campground cleaner than you found it.
4. Always find root cause. Always look for the root cause of a problem.

Design rules

Kais3rP

import { useCallback, useEffect, useRef, useState } from 'react';
import { useBlogUIStore, useBlogStore } from 'store';
import GenericButton from 'components/shared/Buttons/GenericButton';
import { useWeb3Login } from 'hooks/authentication';
import { useOnClickOutside } from 'hooks';
import metaMaskLogo from 'assets/metamask.svg';
import coinbaseLogo from 'assets/coinbase.svg';
import ledgerLogo from 'assets/ledger.svg';
import safeWalletLogo from 'assets/safe-wallet.svg';
import genericLogo from 'assets/generic-wallet.svg';

Kais3rP

import { useCallback, useEffect, useRef, useState } from 'react';
import { useBlogUIStore, useBlogStore } from 'store';
import GenericButton from 'components/shared/Buttons/GenericButton';
import { useWeb3Login } from 'hooks/authentication';
import { useOnClickOutside } from 'hooks';
import metaMaskLogo from 'assets/metamask.svg';
import coinbaseLogo from 'assets/coinbase.svg';
import ledgerLogo from 'assets/ledger.svg';
import safeWalletLogo from 'assets/safe-wallet.svg';
import genericLogo from 'assets/generic-wallet.svg';