diff --git a/src/entities/specialization/index.ts b/src/entities/specialization/index.ts index e4954dd39..c8dce3241 100644 --- a/src/entities/specialization/index.ts +++ b/src/entities/specialization/index.ts @@ -9,6 +9,7 @@ export { useGetSpecializationsGeneralProgressQuery, } from './api/specializationApi'; export { SpecializationCard } from './ui/SpecializationCard/SpecializationCard'; +export { SpecializationCardSkeleton } from './ui/SpecializationCard/SpecializationCard.skeleton'; export { SpecializationForm } from './ui/SpecializationForm/SpecializationForm'; export { SpecializationSelect } from './ui/SpecializationSelect/SpecializationSelect'; export { SpecializationSelectSkeleton } from './ui/SpecializationSelect/SpecializationSelect.skeleton'; diff --git a/src/entities/specialization/ui/SpecializationCard/SpecializationCard.skeleton.tsx b/src/entities/specialization/ui/SpecializationCard/SpecializationCard.skeleton.tsx new file mode 100644 index 000000000..ea77b091c --- /dev/null +++ b/src/entities/specialization/ui/SpecializationCard/SpecializationCard.skeleton.tsx @@ -0,0 +1,31 @@ +import classNames from 'classnames'; + +import { CardSkeleton } from '@/shared/ui/Card'; +import { Flex } from '@/shared/ui/Flex'; +import { ImageWithWrapperSkeleton } from '@/shared/ui/ImageWithWrapper'; +import { Skeleton } from '@/shared/ui/Skeleton'; + +import styles from './SpecializationCard.module.css'; + +export const SpecializationCardSkeleton = () => { + return ( + + + + +
+ +
+ + + +
+
+ + + + +
+
+ ); +}; diff --git a/src/features/company/deleteCompany/index.ts b/src/features/company/deleteCompany/index.ts index e6fb875a1..93d32d2b8 100644 --- a/src/features/company/deleteCompany/index.ts +++ b/src/features/company/deleteCompany/index.ts @@ -1,4 +1,5 @@ export { DeleteCompanyButton } from './ui/DeleteCompanyButton/DeleteCompanyButton'; +export { DeleteCompanyButtonSkeleton } from './ui/DeleteCompanyButton/DeleteCompanyButton.skeleton'; import { deleteCompanyMock } from './api/__mock__/deleteCompany'; export const deleteCompanyHandlers = [deleteCompanyMock]; diff --git a/src/features/company/deleteCompany/ui/DeleteCompanyButton/DeleteCompanyButton.skeleton.tsx b/src/features/company/deleteCompany/ui/DeleteCompanyButton/DeleteCompanyButton.skeleton.tsx new file mode 100644 index 000000000..37efa89ab --- /dev/null +++ b/src/features/company/deleteCompany/ui/DeleteCompanyButton/DeleteCompanyButton.skeleton.tsx @@ -0,0 +1,9 @@ +import { DeleteButtonSkeleton } from '@/shared/ui/DeleteButton'; + +import { DeleteCompanyButtonProps } from './DeleteCompanyButton'; + +export const DeleteCompanyButtonSkeleton = ({ + isDetailPage = false, +}: Partial) => { + return ; +}; diff --git a/src/features/company/deleteCompany/ui/DeleteCompanyButton/DeleteCompanyButton.tsx b/src/features/company/deleteCompany/ui/DeleteCompanyButton/DeleteCompanyButton.tsx index aea521619..2b0af4384 100644 --- a/src/features/company/deleteCompany/ui/DeleteCompanyButton/DeleteCompanyButton.tsx +++ b/src/features/company/deleteCompany/ui/DeleteCompanyButton/DeleteCompanyButton.tsx @@ -5,7 +5,7 @@ import { Company } from '@/entities/company'; import { useDeleteCompanyMutation } from '../../api/deleteCompanyApi'; -interface DeleteCompanyButtonProps { +export interface DeleteCompanyButtonProps { companyId: Company['id']; isDetailPage?: boolean; disabled?: boolean; diff --git a/src/features/question/deleteQuestion/ui/DeleteQuestionButton/DeleteQuestionButton.skeleton.tsx b/src/features/question/deleteQuestion/ui/DeleteQuestionButton/DeleteQuestionButton.skeleton.tsx index 1879e3f90..e8e0ab128 100644 --- a/src/features/question/deleteQuestion/ui/DeleteQuestionButton/DeleteQuestionButton.skeleton.tsx +++ b/src/features/question/deleteQuestion/ui/DeleteQuestionButton/DeleteQuestionButton.skeleton.tsx @@ -1,16 +1,9 @@ -import { ButtonSkeleton } from '@/shared/ui/Button'; +import { DeleteButtonSkeleton } from '@/shared/ui/DeleteButton'; import { DeleteQuestionButtonProps } from './DeleteQuestionButton'; export const DeleteQuestionButtonSkeleton = ({ isDetailPage = false, }: Partial) => { - return ( - - ); + return ; }; diff --git a/src/features/specialization/deleteSpecialization/index.ts b/src/features/specialization/deleteSpecialization/index.ts index 6fbf72c6d..bb7b91514 100644 --- a/src/features/specialization/deleteSpecialization/index.ts +++ b/src/features/specialization/deleteSpecialization/index.ts @@ -1,3 +1,4 @@ export { DeleteSpecializationButton } from './ui/DeleteSpecializationButton/DeleteSpecializationButton'; +export { DeleteSpecializationButtonSkeleton } from './ui/DeleteSpecializationButton/DeleteSpecializationButton.skeleton'; export { specializationDeleteHandlers } from './api/__mocks__'; diff --git a/src/features/specialization/deleteSpecialization/ui/DeleteSpecializationButton/DeleteSpecializationButton.skeleton.tsx b/src/features/specialization/deleteSpecialization/ui/DeleteSpecializationButton/DeleteSpecializationButton.skeleton.tsx new file mode 100644 index 000000000..fbc9f0cf0 --- /dev/null +++ b/src/features/specialization/deleteSpecialization/ui/DeleteSpecializationButton/DeleteSpecializationButton.skeleton.tsx @@ -0,0 +1,9 @@ +import { DeleteButtonSkeleton } from '@/shared/ui/DeleteButton'; + +import { DeleteSpecializationButtonProps } from './DeleteSpecializationButton'; + +export const DeleteSpecializationButtonSkeleton = ({ + isDetailPage, +}: Partial) => { + return ; +}; diff --git a/src/features/specialization/deleteSpecialization/ui/DeleteSpecializationButton/DeleteSpecializationButton.tsx b/src/features/specialization/deleteSpecialization/ui/DeleteSpecializationButton/DeleteSpecializationButton.tsx index 2e957fe2f..bd95093a9 100644 --- a/src/features/specialization/deleteSpecialization/ui/DeleteSpecializationButton/DeleteSpecializationButton.tsx +++ b/src/features/specialization/deleteSpecialization/ui/DeleteSpecializationButton/DeleteSpecializationButton.tsx @@ -4,7 +4,7 @@ import { Specialization } from '@/entities/specialization'; import { useDeleteSpecializationMutation } from '../../api/deleteSpecializationApi'; -interface DeleteSpecializationButtonProps { +export interface DeleteSpecializationButtonProps { specializationId: Specialization['id']; isDetailPage?: boolean; } diff --git a/src/pages/admin/company/companyDetail/ui/CompanyDetailPageContent/CompanyDetailPageContent.skeleton.tsx b/src/pages/admin/company/companyDetail/ui/CompanyDetailPageContent/CompanyDetailPageContent.skeleton.tsx index c0895fe15..1c254f1c6 100644 --- a/src/pages/admin/company/companyDetail/ui/CompanyDetailPageContent/CompanyDetailPageContent.skeleton.tsx +++ b/src/pages/admin/company/companyDetail/ui/CompanyDetailPageContent/CompanyDetailPageContent.skeleton.tsx @@ -3,13 +3,13 @@ import { ButtonSkeleton } from '@/shared/ui/Button'; import { CompanyCardSkeleton } from '@/entities/company'; -import { DeleteQuestionButtonSkeleton } from '@/features/question/deleteQuestion'; +import { DeleteCompanyButtonSkeleton } from '@/features/company/deleteCompany'; export const CompanyDetailPageSkeleton = () => { return ( <> - + diff --git a/src/pages/admin/specialization/specializationDetail/ui/SpecializationDetailPage/SpecializationDetailPage.skeleton.tsx b/src/pages/admin/specialization/specializationDetail/ui/SpecializationDetailPage/SpecializationDetailPage.skeleton.tsx new file mode 100644 index 000000000..3deb732d9 --- /dev/null +++ b/src/pages/admin/specialization/specializationDetail/ui/SpecializationDetailPage/SpecializationDetailPage.skeleton.tsx @@ -0,0 +1,22 @@ +import { BackButtonSkeleton } from '@/shared/ui/BackButton'; +import { ButtonSkeleton } from '@/shared/ui/Button'; +import { Flex } from '@/shared/ui/Flex'; + +import { SpecializationCardSkeleton } from '@/entities/specialization'; + +import { DeleteSpecializationButtonSkeleton } from '@/features/specialization/deleteSpecialization'; + +export const SpecializationDetailPageSkeleton = () => { + return ( + <> + + + + + + + + + + ); +}; diff --git a/src/pages/admin/specialization/specializationDetail/ui/SpecializationDetailPage/SpecializationDetailPage.tsx b/src/pages/admin/specialization/specializationDetail/ui/SpecializationDetailPage/SpecializationDetailPage.tsx index 749179ff9..e7b9c203a 100644 --- a/src/pages/admin/specialization/specializationDetail/ui/SpecializationDetailPage/SpecializationDetailPage.tsx +++ b/src/pages/admin/specialization/specializationDetail/ui/SpecializationDetailPage/SpecializationDetailPage.tsx @@ -6,7 +6,6 @@ import { route } from '@/shared/libs'; import { BackButton } from '@/shared/ui/BackButton'; import { Button } from '@/shared/ui/Button'; import { Flex } from '@/shared/ui/Flex'; -import { Loader } from '@/shared/ui/Loader'; import { useGetSpecializationByIdQuery, SpecializationCard } from '@/entities/specialization'; @@ -14,6 +13,8 @@ import { DeleteSpecializationButton } from '@/features/specialization/deleteSpec import { PageWrapper, PageWrapperStubs } from '@/widgets/PageWrapper'; +import { SpecializationDetailPageSkeleton } from './SpecializationDetailPage.skeleton'; + const SpecializationDetailPage = () => { const { t } = useTranslation(i18Namespace.translation); const { specializationId } = useParams<{ specializationId: string }>(); @@ -63,7 +64,7 @@ const SpecializationDetailPage = () => { <> } + skeleton={} hasError={isError} hasData={hasData} stubs={stubs} diff --git a/src/shared/ui/DeleteButton/DeleteButton.skeleton.tsx b/src/shared/ui/DeleteButton/DeleteButton.skeleton.tsx new file mode 100644 index 000000000..27da5730a --- /dev/null +++ b/src/shared/ui/DeleteButton/DeleteButton.skeleton.tsx @@ -0,0 +1,14 @@ +import { ButtonSkeleton } from '@/shared/ui/Button'; + +import { DeleteButtonProps } from './DeleteButton'; + +export const DeleteButtonSkeleton = ({ isDetailPage }: Partial) => { + return ( + + ); +}; diff --git a/src/shared/ui/DeleteButton/DeleteButton.tsx b/src/shared/ui/DeleteButton/DeleteButton.tsx index a4dfaac7d..94fa6d21a 100644 --- a/src/shared/ui/DeleteButton/DeleteButton.tsx +++ b/src/shared/ui/DeleteButton/DeleteButton.tsx @@ -7,7 +7,7 @@ import { Button } from '@/shared/ui/Button'; import { Icon } from '@/shared/ui/Icon'; import { Tooltip } from '@/shared/ui/Tooltip'; -interface DeleteButtonProps { +export interface DeleteButtonProps { onDelete: () => void; isDetailPage?: boolean; disabled?: boolean; diff --git a/src/shared/ui/DeleteButton/index.ts b/src/shared/ui/DeleteButton/index.ts index 45cf4a7bf..86c21c8e1 100644 --- a/src/shared/ui/DeleteButton/index.ts +++ b/src/shared/ui/DeleteButton/index.ts @@ -1 +1,2 @@ export { DeleteButton } from './DeleteButton'; +export { DeleteButtonSkeleton } from './DeleteButton.skeleton';