import { create } from "zustand"; import { persist } from "zustand/middleware"; export interface AccessControlStore { accessCode: string; token: string; needCode: boolean; updateToken: (_: string) => void; updateCode: (_: string) => void; enabledAccessControl: () => boolean; isAuthorized: () => boolean; fetch: () => void; } export const ACCESS_KEY = "access-control"; let fetchState = 0; // 0 not fetch, 1 fetching, 2 done export const useAccessStore = create<AccessControlStore>()( persist( (set, get) => ({ token: "", accessCode: "", needCode: true, enabledAccessControl() { get().fetch(); return get().needCode; }, updateCode(code: string) { set((state) => ({ accessCode: code })); }, updateToken(token: string) { set((state) => ({ token })); }, isAuthorized() { // has token or has code or disabled access control return ( !!get().token || !!get().accessCode || !get().enabledAccessControl() ); }, fetch() { if (fetchState > 0) return; fetchState = 1; fetch("/api/config", { method: "post", body: null, }) .then((res) => res.json()) .then((res: DangerConfig) => { console.log("[Config] got config from server", res); set(() => ({ ...res })); }) .catch(() => { console.error("[Config] failed to fetch config"); }) .finally(() => { fetchState = 2; }); }, }), { name: ACCESS_KEY, version: 1, }, ), );

2023-04-21by@2837206644-1IUWg&@ChatGPT.Model: gpt-3.5
2837206644-1IUWg

import { create } from "zustand";
import { persist } from "zustand/middleware";

export interface AccessControlStore {
accessCode: string;
token: string;

needCode: boolean;

updateToken: (: string) => void;
updateCode: (
: string) => void;
enabledAccessControl: () => boolean;
isAuthorized: () => boolean;
fetch: () => void;
}

export const ACCESS_KEY = "access-control";

let fetchState = 0; // 0 not fetch, 1 fetching, 2 done

export const useAccessStore = create<AccessControlStore>()(
persist(
(set, get) => ({
token: "",
accessCode: "",
needCode: true,
enabledAccessControl() {
get().fetch();

    return get().needCode;
  },
  updateCode(code: string) {
    set((state) => ({ accessCode: code }));
  },
  updateToken(token: string) {
    set((state) => ({ token }));
  },
  isAuthorized() {
    // has token or has code or disabled access control
    return (
      !!get().token || !!get().accessCode || !get().enabledAccessControl()
    );
  },
  fetch() {
    if (fetchState > 0) return;
    fetchState = 1;
    fetch("/api/config", {
      method: "post",
      body: null,
    })
      .then((res) => res.json())
      .then((res: DangerConfig) => {
        console.log("[Config] got config from server", res);
        set(() => ({ ...res }));
      })
      .catch(() => {
        console.error("[Config] failed to fetch config");
      })
      .finally(() => {
        fetchState = 2;
      });
  },
}),
{
  name: ACCESS_KEY,
  version: 1,
},

),
);

Avatar
Avatar

This is a TypeScript module that exports a useAccessStore hook and an AccessControlStore interface. The AccessControlStore interface defines the state shape of the store and the methods that can be used to update and access it. The useAccessStore hook creates a new instance of the store and returns its state and methods.

The store has four properties: accessCode, token, needCode, and fetchState. accessCode and token store the access code and token needed for authorization, respectively. needCode is a boolean that indicates whether access control is enabled or not. fetchState is a number that indicates the state of the fetch operation for the configuration data.

The store has five methods: updateToken, updateCode, enabledAccessControl, isAuthorized, and fetch. updateToken and updateCode are used to update the token and accessCode properties, respectively. enabledAccessControl returns a boolean that indicates whether access control is enabled or not. isAuthorized returns a boolean that indicates whether the user is authorized to access the protected content. fetch is used to fetch the configuration data from the server.

Avatar

你好!有什么我可以帮助你的吗?

2837206644-1IUWg

import { create } from "zustand";
import { persist } from "zustand/middleware";

export interface AccessControlStore {
accessCode: string;
token: string;

needCode: boolean;

updateToken: (: string) => void;
updateCode: (
: string) => void;
enabledAccessControl: () => boolean;
isAuthorized: () => boolean;
fetch: () => void;
}

export const ACCESS_KEY = "access-control";

let fetchState = 0; // 0 not fetch, 1 fetching, 2 done

export const useAccessStore = create<AccessControlStore>()(
persist(
(set, get) => ({
token: "",
accessCode: "",
needCode: true,
enabledAccessControl() {
get().fetch();

    return get().needCode;
  },
  updateCode(code: string) {
    set((state) => ({ accessCode: code }));
  },
  updateToken(token: string) {
    set((state) => ({ token }));
  },
  isAuthorized() {
    // has token or has code or disabled access control
    return (
      !!get().token || !!get().accessCode || !get().enabledAccessControl()
    );
  },
  fetch() {
    if (fetchState > 0) return;
    fetchState = 1;
    fetch("/api/config", {
      method: "post",
      body: null,
    })
      .then((res) => res.json())
      .then((res: DangerConfig) => {
        console.log("[Config] got config from server", res);
        set(() => ({ ...res }));
      })
      .catch(() => {
        console.error("[Config] failed to fetch config");
      })
      .finally(() => {
        fetchState = 2;
      });
  },
}),
{
  name: ACCESS_KEY,
  version: 1,
},

),
);

Avatar
Avatar

This is a TypeScript module that exports a useAccessStore hook and an AccessControlStore interface. The AccessControlStore interface defines the state shape of the store and the methods that can be used to update and access it. The useAccessStore hook creates a new instance of the store and returns its state and methods.

The store has four properties: accessCode, token, needCode, and fetchState. accessCode and token store the access code and token needed for authorization, respectively. needCode is a boolean that indicates whether access control is enabled or not. fetchState is a number that indicates the state of the fetch operation for the configuration data.

The store has five methods: updateToken, updateCode, enabledAccessControl, isAuthorized, and fetch. updateToken and updateCode are used to update the token and accessCode properties, respectively. enabledAccessControl returns a boolean that indicates whether access control is enabled or not. isAuthorized returns a boolean that indicates whether the user is authorized to access the protected content. fetch is used to fetch the configuration data from the server.