import { type Menu, type MenuPath, menus } from '@/router/menu.ts';

export function useStep(mode: Ref<string>, id: Ref<string>, title?: Ref<string | void>) {
  const menu = shallowRef<Menu | void>();
  const tabTitle = computed(() => menu.value?.title.replace('管理', '确认') ?? '确认');

  watchEffect(() => {
    const _menu = menus[`/step/${mode.value}` as MenuPath];
    if (!_menu) {
      menu.value = { title: import.meta.env.SIX_TITLE!! } as any;
    } else if (title?.value) {
      menu.value = { ..._menu, title: title?.value };
    } else {
      menu.value = _menu;
    }
  });

  const router = useRouter();

  function next(value: string) {
    return router.push({ path: `/step/${mode.value}/${value}`, replace: !!id.value });
  }

  function prev() {
    return router.back();
  }

  return { menu, tabTitle, next, prev };
}