https://github.com/jondotsoy/react-dynamic-hook

https://github.com/jondotsoy/react-dynamic-hook

Last synced: about 2 months ago
JSON representation

• Host: GitHub
• URL: https://github.com/jondotsoy/react-dynamic-hook
• Owner: JonDotsoy
• Created: 2021-10-25T00:23:22.000Z (over 3 years ago)
• Default Branch: development
• Last Pushed: 2021-10-25T02:59:50.000Z (over 3 years ago)
• Last Synced: 2025-03-18T03:52:10.953Z (2 months ago)
• Language: TypeScript
• Size: 136 KB
• Stars: 0
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md

Awesome Lists containing this project

README

        
# React-Dynamic-Hook

Easy create hook to react. Allow create call hooks to use in provide context or simple app without context.

### Sample

```ts

// ./components/user.ts

import { createDynamicHook } from "@jondotsoy/react-dynamic-hook";

import { useEffect } from "react";

import { auth, User } from "./my-auth-srv";

const useUserHook = () => {

  const [user, setUser] = useState(null);

  const [loading, setLoading] = useState(true);

  useEffect(() => {

    setLoading(true);

    auth.onAuthStateChanged(user => {

      setUser(user);

      setLoading(false);

    });

  }, []);

  return {

    loading,

    user,

  };

}

const hook = createDynamicHook(useUserHook);

export const useUser = hook.useHook;

export const UserProvider = hook.Provider;

```

```tsx

// _app.tsx

import { UserProvider } from "./components/user"

import type { AppProps } from "next/app"

const App = ({ Component, pageProps }: AppProps) => {

  return 

    

  

}

export default App;

```

Without context:

```ts

// simple_app.tsx

import { useUser } from "./components/user"

const SimpleApp = () => {

  const { loading, user } =  useUser();

  // ...

}

export default SimpleApp;

```