Created
April 21, 2021 12:52
-
-
Save codemile/c2a13137a08d5f285b1feb88d017bf91 to your computer and use it in GitHub Desktop.
A simple logging hook for React
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import {useMemo} from 'react'; | |
| /** | |
| * Prevents React.DOM from replacing methods inside hooks. | |
| */ | |
| const ref = { | |
| log: console.log, | |
| error: console.error, | |
| debug: console.debug | |
| }; | |
| /** | |
| * Global logger accessible from Redux/Thunk and services. | |
| */ | |
| export const logger = (prefix: string, name: string = 'log') => { | |
| const func = ref[name] || console[name]; | |
| return func.bind(console, `${prefix}:`); | |
| }; | |
| export const loggerDebug = (prefix: string) => logger(prefix, 'debug'); | |
| export const loggerError = (prefix: string) => logger(prefix, 'error'); | |
| export const useLogger = (prefix: string, name: string = 'log') => { | |
| return useMemo(() => logger(prefix, name), [prefix, name]); | |
| }; | |
| export const useDebugger = (prefix: string) => { | |
| return useMemo(() => loggerDebug(prefix), [prefix]); | |
| }; | |
| export const useError = (prefix: string) => { | |
| return useMemo(() => loggerError(prefix), [prefix]); | |
| }; |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment