import { usePractitionerServiceContext, useAuthServiceContext, useStaffPermissionServiceContext } from '../../../../services';
import { FhirPractitionerRoleDisplay } from '../../../../components/FhirPractitionerRoleDisplay/FhirPractitionerRoleDisplay';
import { roleForOrganization } from '../../../../utils/practitionerRoleOrgScope';
import PractitionerRolesPage from './PractitionerRolesPage/PractitionerRolesPage';

// The Roles & Specialties tab. staff:manage gets the role form; staff:view reads this practice's role
// on a display that holds no form, so no edit, delete or history act can reach a viewer.
const StaffRecordRoles = () => {
    const { canManage } = useStaffPermissionServiceContext();
    const { practitionerState } = usePractitionerServiceContext();
    const { currentOrganization } = useAuthServiceContext();

    if (canManage('staff')) return <PractitionerRolesPage />;
    if (!practitionerState) return null;

    const role = roleForOrganization(practitionerState.roles, currentOrganization?.id);
    if (!role) {
        return <p className="ak-empty ak-empty--compact">No role at this practice yet.</p>;
    }
    return <FhirPractitionerRoleDisplay practitionerRole={role} asModal={false} />;
};

export default StaffRecordRoles;