fix(contacts, orders): replace empty state messages with DataNotFound component for better user feedback
This commit is contained in:
parent
f6354d41f6
commit
b9371c34ad
@ -1,5 +1,6 @@
|
||||
'use client';
|
||||
|
||||
import { DataNotFound } from '../shared/alert';
|
||||
import { ContactRow } from '../shared/contact-row';
|
||||
import { useCustomerContacts } from '@/hooks/api/contacts';
|
||||
import { LoadingSpinner } from '@repo/ui/components/ui/spinner';
|
||||
@ -9,7 +10,7 @@ export function ContactsList() {
|
||||
|
||||
if (isLoading) return <LoadingSpinner />;
|
||||
|
||||
if (!contacts.length) return <div>Контакты не найдены</div>;
|
||||
if (!contacts.length) return <DataNotFound title="Контакты не найдены" />;
|
||||
|
||||
return (
|
||||
<div className="space-y-2">
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
'use client';
|
||||
|
||||
import { DataNotFound } from '@/components/shared/alert';
|
||||
import { useServicesQuery } from '@/hooks/api/services';
|
||||
import { useOrderStore } from '@/stores/order';
|
||||
import { type ServiceFieldsFragment } from '@repo/graphql/types';
|
||||
@ -18,10 +19,10 @@ export function ServiceSelect() {
|
||||
},
|
||||
});
|
||||
|
||||
if (!services?.length) return null;
|
||||
if (!services?.length) return <DataNotFound title="Услуги не найдены" />;
|
||||
|
||||
return (
|
||||
<div>
|
||||
<div className="space-y-2 px-6">
|
||||
{services.map((service) => service && <ServiceCard key={service.documentId} {...service} />)}
|
||||
</div>
|
||||
);
|
||||
@ -40,7 +41,7 @@ function ServiceCard({ documentId, name }: Readonly<ServiceFieldsFragment>) {
|
||||
return (
|
||||
<label
|
||||
className={cn(
|
||||
'flex items-center justify-between border-2 rounded-2xl bg-background p-4 px-6 cursor-pointer dark:bg-primary/5',
|
||||
'flex items-center justify-between border-2 rounded-2xl bg-background p-4 cursor-pointer dark:bg-primary/5',
|
||||
selected ? 'border-primary' : 'border-transparent',
|
||||
)}
|
||||
>
|
||||
|
||||
12
apps/web/components/shared/alert.tsx
Normal file
12
apps/web/components/shared/alert.tsx
Normal file
@ -0,0 +1,12 @@
|
||||
import { AlertCircleIcon } from 'lucide-react';
|
||||
|
||||
export function DataNotFound({ title }: { readonly title: string }) {
|
||||
return (
|
||||
<div className="p-4">
|
||||
<div className="line-clamp-1 flex items-center justify-center text-sm font-medium tracking-tight text-secondary-foreground">
|
||||
<AlertCircleIcon className="mr-2 size-4" />
|
||||
<span className="line-clamp-1 font-medium tracking-tight">{title}</span>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Loading…
x
Reference in New Issue
Block a user