visualization-tool/app/flags/useFlag.ts at 52ae32d7f73639e90d338b363bf7489adbaa0c74 · visualize-admin/visualization-tool · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
import { useEffect, useState } from "react";

import { flag } from "./flag";
import { FlagName } from "./types";

export default function useFlagValue(name: FlagName) {
  const [flagValue, setFlag] = useState(() => flag(name));

  useEffect(() => {
    const handleChange = (changed: string) => {
      if (changed === name) {
        setFlag(flag(name));
      }
    };

    flag.store.ee.on("change", handleChange);

    return () => {
      flag.store.removeListener("change", handleChange);
    };
  }, [setFlag, name]);

  return flagValue;
}

export function useFlags() {
  const [flags, setFlags] = useState(flag.list());

  useEffect(() => {
    const handleChange = () => {
      setFlags(flag.list());
    };

    flag.store.ee.on("change", handleChange);

    return () => {
      flag.store.removeListener("change", handleChange);
    };
  }, [setFlags]);

  return flags;
}