recoil#selector TypeScript Examples

AuthContextHandler = selector<{ fade?: boolean, process?: Process, error?: string | null }>({
    key: 'AuthContextHandler',
    get: ({get}) => {
        const errors = get(AuthErrors);
        const error = get(AuthContextErrorAtom);
        let newError: string = '';

        if (errors.emailError)
            newError = 'enter a valid email address';

        else if (errors.passError)
            newError = 'Password must contain a number, a capital and a small letter';

        else if (errors.authError)
            newError = 'invalid auth key';

        return {
            fade: error ? false : get(AuthFade),
            process: get(AuthContextProcessAtom),
            error: newError === '' ? error : newError
        }
    }, set: ({set, get}, newValue) => {
        const auth = get(Authenticated);
        if (!(newValue instanceof DefaultValue)) {
            newValue.process && NProgress.start();
            if (newValue.process && auth)
                set(AuthContextProcessAtom, newValue.process);

            if (newValue.error !== undefined)
                set(AuthContextErrorAtom, newValue.error);

            if (newValue.fade !== undefined && auth) {
                set(AuthFade, newValue.fade);
                NProgress.done();
            }
        }
    }
})

sendEmail = selector({
  key: 'sendEmailSelector',
  get: async ({ get }) => {
    const payload = get(contactState)
    try {
      let urlWithString =
        `http://localhost:8081/contact_us?email=` +
        payload.email +
        `&customerName=` +
        payload.name +
        `&message=` +
        payload.message
      const res = await axios({
        url: urlWithString,
        method: 'get',
      })
      const status = `${res.data.status}`
      console.log('API :: sendEmail :: results: ' + JSON.stringify(status))
      return res?.data?.status
    } catch (err) {
      console.warn(err)
      return `Error: ` + err
    }
  },
})

CarState = {
    rawCars: atom<Car[]>({
        key: 'cars',
        default: cars
    }),
    categorySearch: atom<string>({
        key: 'categorySearch',
        default: ''
    }),
    filteredCars: selector<Car[]>({
        key: 'filteredCars',
        get: ({get}) => {
            const cars: Car[] = get(CarState.rawCars)
            const searchCategory: string = get(CarState.categorySearch).trim()

            return !searchCategory ? cars : [...cars].filter(item => item.category === searchCategory)
        }
    })
}

enabledModList = selector({
  key: 'EnabledMods',
  get: ({ get }) =>
    get(filteredModList).filter(
      (mod) =>
        (mod.localVersion && mod.isEnabled) ||
        get(modIsLoadingState(mod.uniqueName))
    ),
})

userData = atom<User>({
    key: "userData",
    default: selector({
        key: "userData/default",
        get: async ({ get }) => {
            try {
                return await fetchProfile();
            } catch (err) {
                return null;
            }
        },
    }),
    effects_UNSTABLE: [
        ({ setSelf, trigger }) => {
            const userID = getUserIDFromToken();
            if (userID !== null) {
                ws.subscribe("user", userID, (subscriptionType, { subscription_type, element_id }) => {
                    if (subscription_type === "user" && element_id === userID) {
                        fetchProfile().then((result) => {
                            setSelf(result);
                        });
                    }
                });
                // TODO: handle registration errors

                return () => {
                    ws.unsubscribe("user", userID);
                };
            }
        },
    ],
})

voltagesState = selector({
  key: 'voltages',
  get: ({ get }) => {
    const signal = get(dataState)[0].map(({ v }) => v)
    const vmax = Math.max(...signal)
    const vmin = Math.min(...signal)
    const vpp = vmax - vmin
    const vavr = sum(signal) / signal.length

    return {
      vavr,
      vpp,
      vmin,
      vmax
    }
  }
})

canRunAtom = selector({
  key: 'canRun',
  get({ get }) {
    const status = get(analysisStatusGlobalAtom)
    return (
      status === AlgorithmGlobalStatus.idle ||
      status === AlgorithmGlobalStatus.done ||
      status === AlgorithmGlobalStatus.failed
    )
  },
})

filteredQueryResultsSelector = selector<ReadonlyArray<IconEntry>>({
  key: "filteredQueryResultsSelector",
  get: ({ get }) => {
    const query = get(searchQueryAtom).trim().toLowerCase();
    if (!query) return icons;

    return new Promise((resolve) =>
      resolve(fuse.search(query).map((value) => value.item))
    );
  },
})

playlistVideoSelector = selector({
    key: 'playlistVideoSelector',
    get: ({get}) => {
        const playlist = get(PlaylistAtom);
        const videos = get(PlaylistVideoAtom);
        return playlist.videos.concat(videos);
    }
})

getPowerChartData = selector({
  key: 'GetPowerChartData',
  get: () => {
    return getDataFromAPI()
  },
})

nonAddonModList = selector({
  key: 'NonAddonMods',
  get: ({ get }) => get(filteredModList).filter((mod) => !mod.parent),
})

isGuestUser = selector<boolean>({
    key: "isGuestUser",
    get: async ({ get }) => {
        const user = get(userData);
        return user.is_guest_user;
    },
})

use50percentTriggerVoltage = selector({
  key: '50% trigger voltage',
  get: () => false,
  set: ({ set, get }) => {
    const { vavr } = get(voltagesState)
    set(useTriggerVoltage.send, vavr)
  }
})

hasRanAtom = selector({
  key: 'hasRan',
  get({ get }) {
    const status = get(analysisStatusGlobalAtom)
    return status !== AlgorithmGlobalStatus.idle
  },
})