timc1/kbar

Callback on perform, without replacing perform

osszoi opened this issue · 0 comments

Hi, I'm trying to implement kbar as a search through the app bar. The thing is I have many sections and I'd like to load items from section only when needed, I have this code that loads at start all Programs:

export const useCommandActions = () => {
  const navigate = useNavigate();

  const programs = createAction({
    name: 'Programas',
    // shortcut: ['p'],
    icon: <School />,
    section: 'Secciones'
  });

  const [actions, setActions] = useState([
    programs,
    createAction({
      name: 'Lista de programas',
      icon: <List />,
      section: 'Navegación',
      // shortcut: ['l'],
      parent: programs.id,
      perform: () => navigate(PATHS.ProgramsList)
    })
  ]);

  useEffect(() => {
    API.Program.getList({ page: 0, size: 9999 }).then((response) => {
      setActions((prev) => [
        ...prev,
        ...response.content.map(({ id, name, description, byCalendar }) =>
          createAction({
            name,
            subtitle: description,
            icon: !!byCalendar && <CalendarMonth />,
            keywords: `${name} ${id}`,
            section: 'Programas',
            perform: () => {
              navigate(PATHS.ProgramView.replace(':programId', id));
            },
            parent: programs.id
          })
        )
      ]);
    });
  }, []);

  useRegisterActions(actions, [actions]);
};

I'd like to load them ONLY when programs action is opened, but if I add perform to it I can load them but then I don't know how to go to the childs as it automatically do when I don't pass perform