Skip to content

Instantly share code, notes, and snippets.

@ApolloTang

ApolloTang/client-session-manager.tsx

Last active April 12, 2022 06:41
Show Gist options
  • Save ApolloTang/adb8571f97923fc6575ae24387c3bae2 to your computer and use it in GitHub Desktop.
Save ApolloTang/adb8571f97923fc6575ae24387c3bae2 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. ApolloTang revised this gist Apr 12, 2022. 1 changed file with 3 additions and 3 deletions.
    6 changes: 3 additions & 3 deletions client-session-manager.tsx
    View file
    Original file line number Diff line number Diff line change
    @@ -17,12 +17,12 @@ const ClientSessionProvide = (props: propsType) => {
    useEffect(() => {
    resetClientSession = () => {
    if (id) {
    clearInterval(id);
    clearTimeout(id);
    }
    ctx.isFullLogin = true;
    id = setInterval(() => {
    id = setTimeout(() => {
    ctx.isFullLogin = false;
    }, 1000);
    }, fifteenMin );
    };
    }, []);

  2. ApolloTang revised this gist Apr 12, 2022. 1 changed file with 2 additions and 2 deletions.
    4 changes: 2 additions & 2 deletions client-session-manager.tsx
    View file
    Original file line number Diff line number Diff line change
    @@ -43,10 +43,10 @@ export {

    function Foo(props: propsType) {
    const { children } = props;
    const {ctx } = React.useContext(SessionCtx);
    const { isFullLogin } = React.useContext(SessionCtx);
    return (
    <>
    <div>{ctx.isFullLogin}</div>
    <div>{ isFullLogin }</div>
    {children}
    </>
    );
  3. ApolloTang revised this gist Apr 12, 2022. 1 changed file with 2 additions and 2 deletions.
    4 changes: 2 additions & 2 deletions client-session-manager.tsx
    View file
    Original file line number Diff line number Diff line change
    @@ -43,10 +43,10 @@ export {

    function Foo(props: propsType) {
    const { children } = props;
    const { isFullLogin } = React.useContext(SessionCtx);
    const {ctx } = React.useContext(SessionCtx);
    return (
    <>
    <div>{isFullLogin}</div>
    <div>{ctx.isFullLogin}</div>
    {children}
    </>
    );
  4. ApolloTang revised this gist Apr 12, 2022. 1 changed file with 1 addition and 0 deletions.
    1 change: 1 addition & 0 deletions client-session-manager.tsx
    View file
    Original file line number Diff line number Diff line change
    @@ -38,6 +38,7 @@ export {
    ClientSessionProvide,
    resetClientSession, // <--- This is a live export see
    // https://stackoverflow.com/questions/32558514/javascript-es6-export-const-vs-export-let
    // it is assign the value after ClientSessionProvide has mounted.
    };

    function Foo(props: propsType) {
  5. ApolloTang created this gist Apr 12, 2022.
    52 changes: 52 additions & 0 deletions client-session-manager.tsx
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,52 @@
    import React, { useEffect } from 'react';

    let resetClientSession: () => void;

    const SessionCtx = React.createContext(null);

    type propsType = {
    children: JSX.Element;
    };

    const ClientSessionProvide = (props: propsType) => {
    const { children } = props;
    let id;

    const ctx = { isFullLogin: false }; // I am not sure if this should be a useState

    useEffect(() => {
    resetClientSession = () => {
    if (id) {
    clearInterval(id);
    }
    ctx.isFullLogin = true;
    id = setInterval(() => {
    ctx.isFullLogin = false;
    }, 1000);
    };
    }, []);

    return (
    <SessionCtx.Provider value={ctx}>
    <Foo>{children}</Foo>
    </SessionCtx.Provider>
    );
    };

    export {
    SessionCtx,
    ClientSessionProvide,
    resetClientSession, // <--- This is a live export see
    // https://stackoverflow.com/questions/32558514/javascript-es6-export-const-vs-export-let
    };

    function Foo(props: propsType) {
    const { children } = props;
    const { isFullLogin } = React.useContext(SessionCtx);
    return (
    <>
    <div>{isFullLogin}</div>
    {children}
    </>
    );
    }