import { A, useLocation } from '@solidjs/router';
import { createMemo } from 'solid-js';

export default function OnboardingManagementTabs() {
  const location = useLocation();
  const pathname = createMemo(() => location.pathname);
  const onList = createMemo(() => pathname() === '/admin/onboarding-schemas');
  const onCreate = createMemo(() => pathname() === '/admin/onboarding-schemas/new');
  const onRoleMapping = createMemo(() => pathname() === '/admin/external-roles' || pathname().startsWith('/admin/external-roles/') || pathname() === '/admin/role-ui-configs');

  return (
    <div class="admin-link-tabs" style="margin-top:0">
      <A class={`admin-link-tab ${onList() ? 'active' : ''}`} href="/admin/onboarding-schemas">View Flows</A>
      <A class={`admin-link-tab ${onCreate() ? 'active' : ''}`} href="/admin/onboarding-schemas/new">Create Flow</A>
      <A class={`admin-link-tab ${onRoleMapping() ? 'active' : ''}`} href="/admin/external-roles">Role Mapping</A>
    </div>
  );
}