bugfix: organization sidebar icon updated like organization switch feature.

This commit is contained in:
2026-05-18 14:08:07 +03:30
parent 95ed1bd4ab
commit 7dba7cc144
16 changed files with 49 additions and 21 deletions

View File

@@ -17,8 +17,8 @@ import { ScheduleDayPicker } from '@/components/ui/shared/ScheduleDayPicker';
import { ToastStack } from '@/components/ui/shared/Toast'; import { ToastStack } from '@/components/ui/shared/Toast';
import { useToast } from '@/lib/hooks/useToast'; import { useToast } from '@/lib/hooks/useToast';
import type { AppointmentPurpose } from '@/types/appointment'; import type { AppointmentPurpose } from '@/types/appointment';
import { formatApiErrorMessage } from '@/lib/formatApiError'; import { formatApiErrorMessage } from '@/components/shared/formatApiError';
import { compareLocalDayStart, getLocalDayIsoRange, startOfLocalDay } from '@/lib/appointmentTime'; import { compareLocalDayStart, getLocalDayIsoRange, startOfLocalDay } from '@/components/appointments/appointmentTime';
const EMPTY_PATIENT_FORM: CreatePatientInput = { const EMPTY_PATIENT_FORM: CreatePatientInput = {
firstName: '', firstName: '',

View File

@@ -4,7 +4,7 @@ import { useEffect, useMemo, useState } from 'react';
import { Button } from '@/components/ui/shared/Button'; import { Button } from '@/components/ui/shared/Button';
import { ToastStack } from '@/components/ui/shared/Toast'; import { ToastStack } from '@/components/ui/shared/Toast';
import { patientsApi } from '@/lib/api/patients'; import { patientsApi } from '@/lib/api/patients';
import { formatApiErrorMessage } from '@/lib/formatApiError'; import { formatApiErrorMessage } from '@/components/shared/formatApiError';
import { useAuth } from '@/lib/hooks/useAuth'; import { useAuth } from '@/lib/hooks/useAuth';
import { useToast } from '@/lib/hooks/useToast'; import { useToast } from '@/lib/hooks/useToast';
import { hasPermission } from '@/components/shared/permissions'; import { hasPermission } from '@/components/shared/permissions';

View File

@@ -0,0 +1,16 @@
import { Building2, Beaker, type LucideIcon } from 'lucide-react';
import type { Organization } from '@/types/organization';
/** Clinic → Building2, Lab → Beaker (switch-organization cards). */
export function organizationTypeIcon(type: Organization['type']): LucideIcon {
return type === 'CLINIC' ? Building2 : Beaker;
}
/** Organizations tab lists counterpart orgs (labs for clinics, clinics for labs). */
export function counterpartOrganizationType(
currentType: Organization['type'] | undefined,
): Organization['type'] {
if (currentType === 'CLINIC') return 'LAB';
if (currentType === 'LAB') return 'CLINIC';
return 'CLINIC';
}

View File

@@ -1,4 +1,4 @@
import { isSameLocalCalendarDay } from '@/lib/appointmentTime'; import { isSameLocalCalendarDay } from '@/components/appointments/appointmentTime';
import type { TreatmentAppointment } from '@/types/treatment'; import type { TreatmentAppointment } from '@/types/treatment';
/** /**

View File

@@ -12,7 +12,7 @@ import {
compareLocalDayStart, compareLocalDayStart,
formatTimeForInput, formatTimeForInput,
isSameLocalCalendarDay, isSameLocalCalendarDay,
} from '@/lib/appointmentTime'; } from '@/components/appointments/appointmentTime';
interface AppointmentBookingModalProps { interface AppointmentBookingModalProps {
open: boolean; open: boolean;

View File

@@ -2,12 +2,12 @@
import { useMemo, useState } from 'react'; import { useMemo, useState } from 'react';
import type { AppointmentColumnProvider, AppointmentRecord } from '@/types/appointment'; import type { AppointmentColumnProvider, AppointmentRecord } from '@/types/appointment';
import { formatHourLabel } from '@/lib/appointmentTime'; import { formatHourLabel } from '@/components/appointments/appointmentTime';
import { import {
computeAppointmentLaneLayouts, computeAppointmentLaneLayouts,
findOverlapCluster, findOverlapCluster,
lanePositionStyles, lanePositionStyles,
} from '@/lib/appointmentOverlapLayout'; } from '@/components/appointments/appointmentOverlapLayout';
import { purposeStyle } from '@/components/ui/appointments/appointmentPurposeStyles'; import { purposeStyle } from '@/components/ui/appointments/appointmentPurposeStyles';
import { AppointmentOverlapPopover } from '@/components/ui/appointments/AppointmentOverlapPopover'; import { AppointmentOverlapPopover } from '@/components/ui/appointments/AppointmentOverlapPopover';

View File

@@ -3,7 +3,9 @@
import { useMemo, useState } from 'react'; import { useMemo, useState } from 'react';
import { useAuth } from '@/lib/hooks/useAuth'; import { useAuth } from '@/lib/hooks/useAuth';
import { canCreateOrganizationFromCurrentOrg } from '@/components/shared/permissions'; import { canCreateOrganizationFromCurrentOrg } from '@/components/shared/permissions';
import { Building2, Beaker, Mail } from 'lucide-react'; import { Building2, Mail } from 'lucide-react';
import type { Organization } from '@/types/organization';
import { organizationTypeIcon } from '@/components/shared/organizationTypeIcon';
import { Input } from '@/components/ui/shared/Input'; import { Input } from '@/components/ui/shared/Input';
import { Button } from '@/components/ui/shared/Button'; import { Button } from '@/components/ui/shared/Button';
@@ -26,8 +28,10 @@ export function OrganizationSelectorContent() {
const [organizationEmail, setOrganizationEmail] = useState(''); const [organizationEmail, setOrganizationEmail] = useState('');
const [organizationType, setOrganizationType] = useState<'CLINIC' | 'LAB'>('CLINIC'); const [organizationType, setOrganizationType] = useState<'CLINIC' | 'LAB'>('CLINIC');
const getIcon = (type: string) => const renderOrgTypeIcon = (type: Organization['type']) => {
type === 'CLINIC' ? <Building2 className="h-8 w-8 icon-flat" /> : <Beaker className="h-8 w-8 icon-flat" />; const Icon = organizationTypeIcon(type);
return <Icon className="h-8 w-8 icon-flat" />;
};
const handleCreateOrganization = async () => { const handleCreateOrganization = async () => {
try { try {
@@ -158,7 +162,7 @@ export function OrganizationSelectorContent() {
className="surface-card p-6 transition-all text-left flex items-center gap-4 hover:border-primary/60" className="surface-card p-6 transition-all text-left flex items-center gap-4 hover:border-primary/60"
> >
<div className="p-3 bg-primary-soft rounded-[var(--radius-sm)] text-primary"> <div className="p-3 bg-primary-soft rounded-[var(--radius-sm)] text-primary">
{getIcon(org.type)} {renderOrgTypeIcon(org.type)}
</div> </div>
<div className="flex-1"> <div className="flex-1">

View File

@@ -1,7 +1,8 @@
// src/components/ui/OrganizationCard.tsx // src/components/ui/OrganizationCard.tsx
import React from 'react'; import React from 'react';
import { Building2, Beaker, ChevronRight } from 'lucide-react'; import { ChevronRight } from 'lucide-react';
import type { Organization } from '@/types/organization'; import type { Organization } from '@/types/organization';
import { organizationTypeIcon } from '@/components/shared/organizationTypeIcon';
interface OrganizationCardProps { interface OrganizationCardProps {
organization: Organization; organization: Organization;
@@ -12,7 +13,7 @@ export const OrganizationCard: React.FC<OrganizationCardProps> = ({
organization, organization,
onSelect, onSelect,
}) => { }) => {
const Icon = organization.type === 'CLINIC' ? Building2 : Beaker; const Icon = organizationTypeIcon(organization.type);
const typeText = organization.type === 'CLINIC' ? 'Dental Clinic' : 'Dental Lab'; const typeText = organization.type === 'CLINIC' ? 'Dental Clinic' : 'Dental Lab';
return ( return (

View File

@@ -2,7 +2,7 @@
import { useEffect, useId, useRef, useState } from 'react'; import { useEffect, useId, useRef, useState } from 'react';
import { ChevronDown, ChevronLeft, ChevronRight } from 'lucide-react'; import { ChevronDown, ChevronLeft, ChevronRight } from 'lucide-react';
import { addCalendarDays, startOfLocalDay } from '@/lib/appointmentTime'; import { addCalendarDays, startOfLocalDay } from '@/components/appointments/appointmentTime';
interface ScheduleDayPickerProps { interface ScheduleDayPickerProps {
value: Date; value: Date;

View File

@@ -14,9 +14,13 @@ import {
} from 'lucide-react'; } from 'lucide-react';
import { useAuth } from '@/lib/hooks/useAuth'; import { useAuth } from '@/lib/hooks/useAuth';
import { canAccessAppointmentsSection, canViewTab } from '@/components/shared/permissions'; import { canAccessAppointmentsSection, canViewTab } from '@/components/shared/permissions';
import {
counterpartOrganizationType,
organizationTypeIcon,
} from '@/components/shared/organizationTypeIcon';
const menu = [ const menu = [
{ name: 'Today', path: '/today', icon: LayoutDashboard, read: 'TAB_TODAY_READ' as const }, { name: 'Dashboard', path: '/today', icon: LayoutDashboard, read: 'TAB_TODAY_READ' as const },
{ name: 'Staff', path: '/staff', icon: UserCog, read: 'TAB_STAFF_READ' as const }, { name: 'Staff', path: '/staff', icon: UserCog, read: 'TAB_STAFF_READ' as const },
{ name: 'Patients', path: '/patients', icon: Users, read: 'TAB_PATIENTS_READ' as const }, { name: 'Patients', path: '/patients', icon: Users, read: 'TAB_PATIENTS_READ' as const },
{ name: 'Appointment', path: '/appointments', icon: Calendar, read: 'TAB_APPOINTMENTS_READ' as const }, { name: 'Appointment', path: '/appointments', icon: Calendar, read: 'TAB_APPOINTMENTS_READ' as const },
@@ -29,6 +33,9 @@ function Sidebar() {
const pathname = usePathname(); const pathname = usePathname();
const { currentOrganization } = useAuth(); const { currentOrganization } = useAuth();
const counterpartLabel = currentOrganization?.type === 'LAB' ? 'Clinics' : 'Labs'; const counterpartLabel = currentOrganization?.type === 'LAB' ? 'Clinics' : 'Labs';
const organizationsTabIcon = organizationTypeIcon(
counterpartOrganizationType(currentOrganization?.type),
);
const visibleMenu = useMemo( const visibleMenu = useMemo(
() => { () => {
@@ -38,7 +45,7 @@ function Sidebar() {
{ {
name: counterpartLabel, name: counterpartLabel,
path: '/organizations', path: '/organizations',
icon: FlaskConical, icon: organizationsTabIcon,
read: 'TAB_ORGANIZATIONS_READ' as const, read: 'TAB_ORGANIZATIONS_READ' as const,
}, },
menu[2], menu[2],
@@ -54,7 +61,7 @@ function Sidebar() {
return canViewTab(currentOrganization, item.read); return canViewTab(currentOrganization, item.read);
}); });
}, },
[counterpartLabel, currentOrganization], [counterpartLabel, organizationsTabIcon, currentOrganization],
); );
return ( return (

View File

@@ -4,7 +4,7 @@ import { CalendarDays } from 'lucide-react';
import { purposeStyle } from '@/components/ui/appointments/appointmentPurposeStyles'; import { purposeStyle } from '@/components/ui/appointments/appointmentPurposeStyles';
import { Card } from '@/components/ui/shared/Card'; import { Card } from '@/components/ui/shared/Card';
import { ScheduleDayPicker } from '@/components/ui/shared/ScheduleDayPicker'; import { ScheduleDayPicker } from '@/components/ui/shared/ScheduleDayPicker';
import { startOfLocalDay } from '@/lib/appointmentTime'; import { startOfLocalDay } from '@/components/appointments/appointmentTime';
import type { TreatmentAppointment } from '@/types/treatment'; import type { TreatmentAppointment } from '@/types/treatment';
interface AppointmentsStripProps { interface AppointmentsStripProps {

View File

@@ -9,7 +9,7 @@ import { Button } from '@/components/ui/shared/Button';
import { Dropdown } from '@/components/ui/shared/Dropdown'; import { Dropdown } from '@/components/ui/shared/Dropdown';
import { SearchBar } from '@/components/ui/shared/SearchBar'; import { SearchBar } from '@/components/ui/shared/SearchBar';
import { Toast } from '@/components/ui/shared/Toast'; import { Toast } from '@/components/ui/shared/Toast';
import { compareLocalDayStart, isSameLocalCalendarDay, startOfLocalDay } from '@/lib/appointmentTime'; import { compareLocalDayStart, isSameLocalCalendarDay, startOfLocalDay } from '@/components/appointments/appointmentTime';
import { import {
fetchLinkedOrganizations, fetchLinkedOrganizations,
fetchMyAppointmentsForDay, fetchMyAppointmentsForDay,
@@ -17,7 +17,7 @@ import {
saveTreatmentDraft, saveTreatmentDraft,
sendTreatmentRecord, sendTreatmentRecord,
} from '@/lib/mocks/treatmentMockApi'; } from '@/lib/mocks/treatmentMockApi';
import { pickAutoAppointment } from '@/lib/treatmentSelection'; import { pickAutoAppointment } from '@/components/shared/treatmentSelection';
import { canEditTreatment } from '@/components/shared/permissions'; import { canEditTreatment } from '@/components/shared/permissions';
import type { Organization } from '@/types/organization'; import type { Organization } from '@/types/organization';
import type { import type {

View File

@@ -2,7 +2,7 @@ import {
addCalendarDays, addCalendarDays,
isSameLocalCalendarDay, isSameLocalCalendarDay,
startOfLocalDay, startOfLocalDay,
} from '@/lib/appointmentTime'; } from '@/components/appointments/appointmentTime';
import type { import type {
FdiToothId, FdiToothId,
LinkedOrganizationOption, LinkedOrganizationOption,