From 4d78c9e9b032c627ab8296315c60433042abe9fa Mon Sep 17 00:00:00 2001
From: Alexandr Novosyolov <aain34@mail.ru>
Date: Thu, 4 Jun 2026 23:26:27 +0300
Subject: [PATCH 1/3] YH-2049: add skeleton for CollectionCreatePage

---
 .../SkeletonGenerator/SkeletonGenerator.tsx   |   3 +
 src/entities/collection/index.ts              |   1 +
 .../CollectionForm/CollectionForm.module.css  |  62 +++++++++++
 .../CollectionForm.skeleton.tsx               | 101 ++++++++++++++++++
 .../collections/createCollection/index.ts     |   2 +
 .../CollectionCreateForm.skeleton.tsx         |  17 +++
 .../CollectionCreateFormHeader.skeleton.tsx   |  12 +++
 .../CollectionCreatePage.tsx                  |   9 +-
 src/shared/ui/Button/Button.skeleton.tsx      |   4 +-
 9 files changed, 209 insertions(+), 2 deletions(-)
 create mode 100644 src/entities/collection/ui/CollectionForm/CollectionForm.skeleton.tsx
 create mode 100644 src/features/collections/createCollection/ui/CollectionCreateForm/CollectionCreateForm.skeleton.tsx
 create mode 100644 src/features/collections/createCollection/ui/CollectionCreateFormHeader/CollectionCreateFormHeader.skeleton.tsx

diff --git a/src/app/layouts/MainLayout/SkeletonGenerator/SkeletonGenerator.tsx b/src/app/layouts/MainLayout/SkeletonGenerator/SkeletonGenerator.tsx
index cfcde4619..2a2d898b5 100644
--- a/src/app/layouts/MainLayout/SkeletonGenerator/SkeletonGenerator.tsx
+++ b/src/app/layouts/MainLayout/SkeletonGenerator/SkeletonGenerator.tsx
@@ -3,6 +3,7 @@ import { matchPath, useLocation } from 'react-router-dom';
 import { ROUTES } from '@/shared/config';
 import { Loader } from '@/shared/ui/Loader';
 
+import { CollectionCreateFormSkeleton } from '@/features/collections/createCollection';
 import { EditProfileFormSkeleton } from '@/features/profile/editProfileForm';
 import { QuestionCreateFormSkeleton } from '@/features/question/createQuestion';
 
@@ -73,6 +74,8 @@ const SkeletonGenerator = () => {
 			return <EditProfileFormSkeleton />;
 		case ROUTES.admin.questions.create.page:
 			return <QuestionCreateFormSkeleton />;
+		case ROUTES.admin.collections.create.page:
+			return <CollectionCreateFormSkeleton />;
 		case ROUTES.admin.questions.page:
 			return <QuestionsTablePageSkeleton />;
 		case ROUTES.admin.specializations.page:
diff --git a/src/entities/collection/index.ts b/src/entities/collection/index.ts
index 1456b1e58..f3062c67a 100644
--- a/src/entities/collection/index.ts
+++ b/src/entities/collection/index.ts
@@ -16,3 +16,4 @@ export { CollectionPreview } from './ui/CollectionPreview/CollectionPreview';
 export { PreviewCollectionsItemSkeleton } from './ui/PreviewCollectionItem/PreviewCollectionsItem.skeleton';
 export { CollectionsPreviewSkeleton } from './ui/CollectionPreview/CollectionPreview.sekeleton';
 export { CollectionSelect } from './ui/CollectionSelect/CollectionSelect';
+export { CollectionFormSkeleton } from './ui/CollectionForm/CollectionForm.skeleton';
diff --git a/src/entities/collection/ui/CollectionForm/CollectionForm.module.css b/src/entities/collection/ui/CollectionForm/CollectionForm.module.css
index 797f1e80b..10fe31bf9 100644
--- a/src/entities/collection/ui/CollectionForm/CollectionForm.module.css
+++ b/src/entities/collection/ui/CollectionForm/CollectionForm.module.css
@@ -21,4 +21,66 @@
   width: 100%;
   min-width: 100px;
   max-width: 408px;
+}
+
+.skeleton-title-control {
+  height: 48px;
+}
+
+.skeleton-dropdown {
+  margin-bottom: 10px;
+}
+
+.skeleton-image-control {
+  width: 100%;
+}
+
+.skeleton-upload-preview {
+  margin-top: 20px;
+}
+
+.skeleton-image-fixed {
+  flex-shrink: 0;
+}
+
+.skeleton-image-fluid {
+  flex: 1 1 458px;
+  min-width: 0;
+  max-width: 458px;
+}
+
+.skeleton-checkbox-control {
+  display: flex;
+  align-items: center;
+}
+
+.skeleton-actions-text {
+  flex-shrink: 0;
+}
+
+.skeleton-keywords-input {
+  margin-bottom: 24px;
+  width: 408px;
+}
+
+.skeleton-actions-control {
+  width: 100%;
+}
+
+@media (width < 1064px) {
+  .skeleton-keywords-input {
+    margin-bottom: 0;
+  }
+
+  .skeleton-dropdown {
+    margin-bottom: 0;
+  }
+
+  .skeleton-dropdown-mobile-offset {
+    margin-top: 18px;
+  }
+
+  .skeleton-actions-field{
+    flex-wrap: nowrap;
+  }
 }
\ No newline at end of file
diff --git a/src/entities/collection/ui/CollectionForm/CollectionForm.skeleton.tsx b/src/entities/collection/ui/CollectionForm/CollectionForm.skeleton.tsx
new file mode 100644
index 000000000..84c492388
--- /dev/null
+++ b/src/entities/collection/ui/CollectionForm/CollectionForm.skeleton.tsx
@@ -0,0 +1,101 @@
+import { ButtonSkeleton } from '@/shared/ui/Button';
+import { DropdownSkeleton } from '@/shared/ui/Dropdown';
+import { Flex } from '@/shared/ui/Flex';
+import { FormControlSkeleton } from '@/shared/ui/FormControl';
+import { FormFieldSkeleton } from '@/shared/ui/FormField';
+import { InputSkeleton } from '@/shared/ui/Input';
+import { Skeleton } from '@/shared/ui/Skeleton';
+import { TextSkeleton } from '@/shared/ui/Text';
+
+import styles from './CollectionForm.module.css';
+
+export const CollectionFormSkeleton = () => {
+	return (
+		<Flex direction="column" gap="60">
+			<div>
+				<TextSkeleton width={160} variant="body5" />
+				<FormFieldSkeleton>
+					<FormControlSkeleton className={styles['skeleton-title-control']}>
+						<InputSkeleton size="L" />
+					</FormControlSkeleton>
+				</FormFieldSkeleton>
+			</div>
+			<FormFieldSkeleton>
+				<FormControlSkeleton>
+					<DropdownSkeleton className={styles['skeleton-dropdown']} size="L" />
+				</FormControlSkeleton>
+			</FormFieldSkeleton>
+
+			<FormFieldSkeleton direction="column">
+				<FormControlSkeleton>
+					<Skeleton
+						className={styles['skeleton-upload-preview']}
+						width={225}
+						height={80}
+						borderRadius={24}
+					/>
+				</FormControlSkeleton>
+			</FormFieldSkeleton>
+
+			<FormFieldSkeleton>
+				<FormControlSkeleton className={styles['skeleton-image-control']}>
+					<Flex gap="32" maxWidth={true}>
+						<Skeleton
+							className={styles['skeleton-image-fixed']}
+							width={170}
+							height={114}
+							borderRadius={20}
+						/>
+						<Skeleton className={styles['skeleton-image-fluid']} height={114} borderRadius={20} />
+					</Flex>
+				</FormControlSkeleton>
+			</FormFieldSkeleton>
+
+			<FormFieldSkeleton>
+				<FormControlSkeleton className={styles['skeleton-checkbox-control']}>
+					<Flex gap="26" maxWidth={true} align="center">
+						<Skeleton width={170} height={20} borderRadius={20} />
+						<Skeleton width={150} height={20} borderRadius={20} />
+					</Flex>
+				</FormControlSkeleton>
+			</FormFieldSkeleton>
+
+			<FormFieldSkeleton>
+				<FormControlSkeleton>
+					<DropdownSkeleton
+						className={`${styles['skeleton-dropdown']} ${styles['skeleton-dropdown-mobile-offset']}`}
+						size="S"
+					/>
+				</FormControlSkeleton>
+			</FormFieldSkeleton>
+
+			<FormFieldSkeleton>
+				<FormControlSkeleton>
+					<Flex direction="column" gap="28">
+						<DropdownSkeleton size="S" />
+						<Flex gap="8" maxWidth={true}>
+							<InputSkeleton className={styles['skeleton-keywords-input']} size="L" />
+							<ButtonSkeleton width={170} height={48} />
+						</Flex>
+					</Flex>
+				</FormControlSkeleton>
+			</FormFieldSkeleton>
+			<FormFieldSkeleton>
+				<FormControlSkeleton className={styles['skeleton-actions-control']}>
+					<Flex gap="8" justify="between">
+						<TextSkeleton width={200} variant="body5" className={styles['skeleton-actions-text']} />
+						<ButtonSkeleton width={170} height={40} />
+					</Flex>
+				</FormControlSkeleton>
+			</FormFieldSkeleton>
+			<FormFieldSkeleton>
+				<FormControlSkeleton className={styles['skeleton-actions-control']}>
+					<Flex gap="8" justify="between">
+						<TextSkeleton width={200} variant="body5" className={styles['skeleton-actions-text']} />
+						<ButtonSkeleton width={170} height={40} />
+					</Flex>
+				</FormControlSkeleton>
+			</FormFieldSkeleton>
+		</Flex>
+	);
+};
diff --git a/src/features/collections/createCollection/index.ts b/src/features/collections/createCollection/index.ts
index 9d91f5fe0..21713d5f0 100644
--- a/src/features/collections/createCollection/index.ts
+++ b/src/features/collections/createCollection/index.ts
@@ -1,3 +1,5 @@
 export { CollectionCreateForm } from './ui/CollectionCreateForm/CollectionCreateForm';
+export { CollectionCreateFormSkeleton } from './ui/CollectionCreateForm/CollectionCreateForm.skeleton';
 export { getCreateCollectionsApiErrorMessage } from './lib/utils/getCreateCollectionsApiErrorMessage';
+export { CollectionCreateFormHeaderSkeleton } from './ui/CollectionCreateFormHeader/CollectionCreateFormHeader.skeleton';
 export { createCollectionHandlers } from './api/__mocks__';
diff --git a/src/features/collections/createCollection/ui/CollectionCreateForm/CollectionCreateForm.skeleton.tsx b/src/features/collections/createCollection/ui/CollectionCreateForm/CollectionCreateForm.skeleton.tsx
new file mode 100644
index 000000000..7cdb9a98f
--- /dev/null
+++ b/src/features/collections/createCollection/ui/CollectionCreateForm/CollectionCreateForm.skeleton.tsx
@@ -0,0 +1,17 @@
+import { Card } from '@/shared/ui/Card';
+import { Flex } from '@/shared/ui/Flex';
+
+import { CollectionFormSkeleton } from '@/entities/collection';
+
+import { CollectionCreateFormHeaderSkeleton } from '@/features/collections/createCollection';
+
+export const CollectionCreateFormSkeleton = () => {
+	return (
+		<Flex componentType="main" direction="column" gap="24">
+			<CollectionCreateFormHeaderSkeleton />
+			<Card>
+				<CollectionFormSkeleton />
+			</Card>
+		</Flex>
+	);
+};
diff --git a/src/features/collections/createCollection/ui/CollectionCreateFormHeader/CollectionCreateFormHeader.skeleton.tsx b/src/features/collections/createCollection/ui/CollectionCreateFormHeader/CollectionCreateFormHeader.skeleton.tsx
new file mode 100644
index 000000000..de0066f0c
--- /dev/null
+++ b/src/features/collections/createCollection/ui/CollectionCreateFormHeader/CollectionCreateFormHeader.skeleton.tsx
@@ -0,0 +1,12 @@
+import { BackButtonSkeleton } from '@/shared/ui/BackButton';
+import { ButtonSkeleton } from '@/shared/ui/Button';
+import { Flex } from '@/shared/ui/Flex';
+
+export const CollectionCreateFormHeaderSkeleton = () => {
+	return (
+		<Flex align="center" gap="8" justify="between">
+			<BackButtonSkeleton />
+			<ButtonSkeleton width={148} />
+		</Flex>
+	);
+};
diff --git a/src/pages/admin/collection/collectionCreate/ui/CollectionCreatePage/CollectionCreatePage.tsx b/src/pages/admin/collection/collectionCreate/ui/CollectionCreatePage/CollectionCreatePage.tsx
index 71eff38f1..ae2bdd96b 100644
--- a/src/pages/admin/collection/collectionCreate/ui/CollectionCreatePage/CollectionCreatePage.tsx
+++ b/src/pages/admin/collection/collectionCreate/ui/CollectionCreatePage/CollectionCreatePage.tsx
@@ -1,10 +1,17 @@
 import { CollectionCreateForm } from '@/features/collections/createCollection';
+import { CollectionCreateFormSkeleton } from '@/features/collections/createCollection';
 
 import { PageWrapper } from '@/widgets/PageWrapper';
 
 const CollectionCreatePage = () => {
 	return (
-		<PageWrapper roles={['admin', 'author']} hasData stubs={{}} content={<CollectionCreateForm />}>
+		<PageWrapper
+			roles={['admin', 'author']}
+			hasData
+			stubs={{}}
+			skeleton={<CollectionCreateFormSkeleton />}
+			content={<CollectionCreateForm />}
+		>
 			{({ content }) => content}
 		</PageWrapper>
 	);
diff --git a/src/shared/ui/Button/Button.skeleton.tsx b/src/shared/ui/Button/Button.skeleton.tsx
index ecd943193..c1420fa58 100644
--- a/src/shared/ui/Button/Button.skeleton.tsx
+++ b/src/shared/ui/Button/Button.skeleton.tsx
@@ -14,7 +14,8 @@ export const ButtonSkeleton = ({
 	size = 'medium',
 	destructive,
 	width,
-}: ButtonProps & { width?: number }) => {
+	height,
+}: ButtonProps & { width?: string | number; height?: string | number }) => {
 	const tagName = getTagName(variant);
 
 	return (
@@ -22,6 +23,7 @@ export const ButtonSkeleton = ({
 			dataTestId={dataTestId}
 			borderRadius={12}
 			width={width}
+			height={height}
 			className={classnames(
 				styles[tagName],
 				styles[`${tagName}-${size}`],

From 6e752162cc6c9b9d16fdc9007d0c326e80d38c1e Mon Sep 17 00:00:00 2001
From: Alexandr Novosyolov <aain34@mail.ru>
Date: Sat, 13 Jun 2026 11:29:21 +0300
Subject: [PATCH 2/3] YH-2049: fixed review comments

---
 src/entities/collection/index.ts              |   2 +-
 .../CollectionForm/CollectionForm.module.css  |  54 +-------
 .../CollectionForm.skeleton.tsx               | 131 ++++++++----------
 src/entities/company/index.ts                 |   1 +
 .../CompanySelect/CompanySelect.skeleton.tsx  |   5 +
 src/entities/question/index.ts                |   1 +
 .../ChooseQuestionsDrawer.skeleton.tsx        |  22 +++
 .../ChooseTasksDrawer.skeleton.tsx            |  22 +++
 .../collections/createCollection/index.ts     |   1 -
 .../CollectionCreateForm.skeleton.tsx         |   8 +-
 src/shared/ui/Button/Button.skeleton.tsx      |   6 +-
 src/shared/ui/Flex/Flex.module.css            |   8 ++
 src/shared/ui/Flex/constants.ts               |   2 +
 src/shared/ui/Flex/types.ts                   |   2 +
 .../ui/FormField/FormField.skeleton.tsx       |  13 +-
 .../ImageLoaderWithoutCropper.module.css      |   7 +
 .../ImageLoaderWithoutCropper.skeleton.tsx    |  14 ++
 .../ui/ImageLoaderWithoutCropper/index.ts     |   1 +
 .../ImageWithWrapper.skeleton.tsx             |  22 ++-
 .../ui/KeywordInput/KeywordInput.skeleton.tsx |   2 +-
 .../SelectWithChips.skeleton.tsx              |   5 +
 src/shared/ui/SelectWithChips/index.ts        |   2 +-
 src/shared/ui/Skeleton/Skeleton.tsx           |   2 +-
 src/shared/ui/TextArea/TextArea.skeleton.tsx  |  18 +++
 src/shared/ui/TextArea/index.ts               |   1 +
 25 files changed, 212 insertions(+), 140 deletions(-)
 create mode 100644 src/entities/company/ui/CompanySelect/CompanySelect.skeleton.tsx
 create mode 100644 src/entities/question/ui/ChooseQuestionsDrawer/ChooseQuestionsDrawer.skeleton.tsx
 create mode 100644 src/entities/task/ui/ChooseTasksDrawer/ChooseTasksDrawer.skeleton.tsx
 create mode 100644 src/shared/ui/ImageLoaderWithoutCropper/ImageLoaderWithoutCropper.skeleton.tsx
 create mode 100644 src/shared/ui/SelectWithChips/SelectWithChips.skeleton.tsx
 create mode 100644 src/shared/ui/TextArea/TextArea.skeleton.tsx

diff --git a/src/entities/collection/index.ts b/src/entities/collection/index.ts
index f3062c67a..032dc2ebb 100644
--- a/src/entities/collection/index.ts
+++ b/src/entities/collection/index.ts
@@ -8,7 +8,6 @@ export { LS_INIT_COLLECTION_ID } from './model/constants/collection';
 export { getCollectionRoute } from '@/entities/collection/lib/getCollectionRoute';
 export { collectionsMock } from './api/__mock__/data';
 export { collectionHandlers } from './api/__mock__/index';
-export { CollectionForm } from './ui/CollectionForm/CollectionForm';
 export * from './api/collectionApi';
 
 export { ChooseCollectionAccess } from './ui/ChooseCollectionAccess/ChooseCollectionAccess';
@@ -16,4 +15,5 @@ export { CollectionPreview } from './ui/CollectionPreview/CollectionPreview';
 export { PreviewCollectionsItemSkeleton } from './ui/PreviewCollectionItem/PreviewCollectionsItem.skeleton';
 export { CollectionsPreviewSkeleton } from './ui/CollectionPreview/CollectionPreview.sekeleton';
 export { CollectionSelect } from './ui/CollectionSelect/CollectionSelect';
+export { CollectionForm } from './ui/CollectionForm/CollectionForm';
 export { CollectionFormSkeleton } from './ui/CollectionForm/CollectionForm.skeleton';
diff --git a/src/entities/collection/ui/CollectionForm/CollectionForm.module.css b/src/entities/collection/ui/CollectionForm/CollectionForm.module.css
index 10fe31bf9..7c63b2aed 100644
--- a/src/entities/collection/ui/CollectionForm/CollectionForm.module.css
+++ b/src/entities/collection/ui/CollectionForm/CollectionForm.module.css
@@ -23,64 +23,22 @@
   max-width: 408px;
 }
 
-.skeleton-title-control {
+/* Skeleton */
+.skeleton-form-field {
   height: 48px;
 }
 
-.skeleton-dropdown {
-  margin-bottom: 10px;
+.skeleton-textarea {
+  margin-top: 18px;
 }
 
-.skeleton-image-control {
-  width: 100%;
-}
-
-.skeleton-upload-preview {
-  margin-top: 20px;
-}
-
-.skeleton-image-fixed {
-  flex-shrink: 0;
-}
-
-.skeleton-image-fluid {
-  flex: 1 1 458px;
-  min-width: 0;
-  max-width: 458px;
-}
-
-.skeleton-checkbox-control {
-  display: flex;
-  align-items: center;
-}
-
-.skeleton-actions-text {
-  flex-shrink: 0;
-}
-
-.skeleton-keywords-input {
+.skeleton-keywords-control {
   margin-bottom: 24px;
-  width: 408px;
 }
 
-.skeleton-actions-control {
-  width: 100%;
-}
 
 @media (width < 1064px) {
-  .skeleton-keywords-input {
-    margin-bottom: 0;
-  }
-
-  .skeleton-dropdown {
+  .skeleton-keywords-control {
     margin-bottom: 0;
   }
-
-  .skeleton-dropdown-mobile-offset {
-    margin-top: 18px;
-  }
-
-  .skeleton-actions-field{
-    flex-wrap: nowrap;
-  }
 }
\ No newline at end of file
diff --git a/src/entities/collection/ui/CollectionForm/CollectionForm.skeleton.tsx b/src/entities/collection/ui/CollectionForm/CollectionForm.skeleton.tsx
index 84c492388..498489bdc 100644
--- a/src/entities/collection/ui/CollectionForm/CollectionForm.skeleton.tsx
+++ b/src/entities/collection/ui/CollectionForm/CollectionForm.skeleton.tsx
@@ -1,101 +1,84 @@
-import { ButtonSkeleton } from '@/shared/ui/Button';
-import { DropdownSkeleton } from '@/shared/ui/Dropdown';
 import { Flex } from '@/shared/ui/Flex';
 import { FormControlSkeleton } from '@/shared/ui/FormControl';
 import { FormFieldSkeleton } from '@/shared/ui/FormField';
 import { InputSkeleton } from '@/shared/ui/Input';
-import { Skeleton } from '@/shared/ui/Skeleton';
 import { TextSkeleton } from '@/shared/ui/Text';
+import { TextAreaSkeleton } from '@/shared/ui/TextArea';
+import { ImageLoaderWithoutCropperSkeleton } from '@/shared/ui/ImageLoaderWithoutCropper';
+import { KeywordSelectSkeleton } from '@/shared/ui/KeywordSelect';
+import { KeywordInputSkeleton } from '@/shared/ui/KeywordInput';
+import { ChooseQuestionsDrawerSkeleton } from '@/entities/question';
+import { SpecializationSelectSkeleton } from '@/entities/specialization';
 
 import styles from './CollectionForm.module.css';
+import { CompanySelectSkeleton } from '@/entities/company';
+import { RadioSkeleton } from '@/shared/ui/Radio';
+import { ChooseTasksDrawerSkeleton } from '@/entities/task/ui/ChooseTasksDrawer/ChooseTasksDrawer.skeleton';
 
 export const CollectionFormSkeleton = () => {
 	return (
-		<Flex direction="column" gap="60">
-			<div>
-				<TextSkeleton width={160} variant="body5" />
+		<>
+			<TextSkeleton width={160} variant="body5" />
+
+			<Flex direction="column" gap="60">
+
 				<FormFieldSkeleton>
-					<FormControlSkeleton className={styles['skeleton-title-control']}>
+					<FormControlSkeleton className={styles['skeleton-form-field']}>
 						<InputSkeleton size="L" />
 					</FormControlSkeleton>
 				</FormFieldSkeleton>
-			</div>
-			<FormFieldSkeleton>
-				<FormControlSkeleton>
-					<DropdownSkeleton className={styles['skeleton-dropdown']} size="L" />
-				</FormControlSkeleton>
-			</FormFieldSkeleton>
 
-			<FormFieldSkeleton direction="column">
-				<FormControlSkeleton>
-					<Skeleton
-						className={styles['skeleton-upload-preview']}
-						width={225}
-						height={80}
-						borderRadius={24}
-					/>
-				</FormControlSkeleton>
-			</FormFieldSkeleton>
+				<FormFieldSkeleton countTextFields={2}>
+					<FormControlSkeleton>
+						<CompanySelectSkeleton />
+					</FormControlSkeleton>
+				</FormFieldSkeleton>
 
-			<FormFieldSkeleton>
-				<FormControlSkeleton className={styles['skeleton-image-control']}>
-					<Flex gap="32" maxWidth={true}>
-						<Skeleton
-							className={styles['skeleton-image-fixed']}
-							width={170}
-							height={114}
-							borderRadius={20}
+				<FormFieldSkeleton direction="column" >
+					<FormControlSkeleton>
+						<TextAreaSkeleton
+							className={styles['skeleton-textarea']}
+							width={225}
+							height={80}
+							borderRadius={24}
 						/>
-						<Skeleton className={styles['skeleton-image-fluid']} height={114} borderRadius={20} />
-					</Flex>
-				</FormControlSkeleton>
-			</FormFieldSkeleton>
+					</FormControlSkeleton>
+				</FormFieldSkeleton>
 
-			<FormFieldSkeleton>
-				<FormControlSkeleton className={styles['skeleton-checkbox-control']}>
-					<Flex gap="26" maxWidth={true} align="center">
-						<Skeleton width={170} height={20} borderRadius={20} />
-						<Skeleton width={150} height={20} borderRadius={20} />
+				<FormFieldSkeleton>
+					<ImageLoaderWithoutCropperSkeleton />
+				</FormFieldSkeleton>
+
+				<FormFieldSkeleton>
+					<Flex gap="56">
+						<RadioSkeleton />
+						<RadioSkeleton />
 					</Flex>
-				</FormControlSkeleton>
-			</FormFieldSkeleton>
+				</FormFieldSkeleton>
+
+				<FormFieldSkeleton countTextFields={2}>
+					<FormControlSkeleton>
+						<SpecializationSelectSkeleton />
+					</FormControlSkeleton>
+				</FormFieldSkeleton>
+
+				<FormFieldSkeleton>
+					<FormControlSkeleton className={styles['skeleton-keywords-control']}>
+						<Flex direction="column" gap="26" maxHeight={true}>
+							<KeywordSelectSkeleton />
+							<KeywordInputSkeleton />
+						</Flex>
+					</FormControlSkeleton>
+				</FormFieldSkeleton>
 
-			<FormFieldSkeleton>
 				<FormControlSkeleton>
-					<DropdownSkeleton
-						className={`${styles['skeleton-dropdown']} ${styles['skeleton-dropdown-mobile-offset']}`}
-						size="S"
-					/>
+					<ChooseQuestionsDrawerSkeleton />
 				</FormControlSkeleton>
-			</FormFieldSkeleton>
 
-			<FormFieldSkeleton>
 				<FormControlSkeleton>
-					<Flex direction="column" gap="28">
-						<DropdownSkeleton size="S" />
-						<Flex gap="8" maxWidth={true}>
-							<InputSkeleton className={styles['skeleton-keywords-input']} size="L" />
-							<ButtonSkeleton width={170} height={48} />
-						</Flex>
-					</Flex>
-				</FormControlSkeleton>
-			</FormFieldSkeleton>
-			<FormFieldSkeleton>
-				<FormControlSkeleton className={styles['skeleton-actions-control']}>
-					<Flex gap="8" justify="between">
-						<TextSkeleton width={200} variant="body5" className={styles['skeleton-actions-text']} />
-						<ButtonSkeleton width={170} height={40} />
-					</Flex>
-				</FormControlSkeleton>
-			</FormFieldSkeleton>
-			<FormFieldSkeleton>
-				<FormControlSkeleton className={styles['skeleton-actions-control']}>
-					<Flex gap="8" justify="between">
-						<TextSkeleton width={200} variant="body5" className={styles['skeleton-actions-text']} />
-						<ButtonSkeleton width={170} height={40} />
-					</Flex>
+					<ChooseTasksDrawerSkeleton />
 				</FormControlSkeleton>
-			</FormFieldSkeleton>
-		</Flex>
+			</Flex>
+		</>
 	);
 };
diff --git a/src/entities/company/index.ts b/src/entities/company/index.ts
index 3300a2ead..646f48d32 100644
--- a/src/entities/company/index.ts
+++ b/src/entities/company/index.ts
@@ -2,6 +2,7 @@ export { CompanyCard } from './ui/CompanyCard/CompanyCard';
 export { CompanyCardSkeleton } from './ui/CompanyCard/CompanyCard.skeleton';
 
 export { CompanySelect } from './ui/CompanySelect/CompanySelect';
+export { CompanySelectSkeleton } from './ui/CompanySelect/CompanySelect.skeleton';
 export { CompanyCompactList } from './ui/CompanyCompactList/CompanyCompactList';
 export { CompanyCompactListSkeleton } from './ui/CompanyCompactList/CompanyCompactList.skeleton';
 export { PublicCompanySelect } from './ui/PublicCompanySelect/PublicCompanySelect';
diff --git a/src/entities/company/ui/CompanySelect/CompanySelect.skeleton.tsx b/src/entities/company/ui/CompanySelect/CompanySelect.skeleton.tsx
new file mode 100644
index 000000000..65337de75
--- /dev/null
+++ b/src/entities/company/ui/CompanySelect/CompanySelect.skeleton.tsx
@@ -0,0 +1,5 @@
+import { SelectWithChipsSkeleton } from '@/shared/ui/SelectWithChips';
+
+export const CompanySelectSkeleton = () => {
+	return <SelectWithChipsSkeleton />;
+};
diff --git a/src/entities/question/index.ts b/src/entities/question/index.ts
index e74394f5f..193a9cbcd 100644
--- a/src/entities/question/index.ts
+++ b/src/entities/question/index.ts
@@ -35,6 +35,7 @@ export { PreviewQuestionsItem } from './ui/PreviewQuestionsItem/PreviewQuestions
 export { PreviewQuestionsItemSkeleton } from './ui/PreviewQuestionsItem/PreviewQuestionsItem.skeleton';
 export { QuestionAdditionalInfo } from './ui/QuestionAdditionalInfo/QuestionAdditionalInfo';
 export { QuestionAdditionalInfoSkeleton } from './ui/QuestionAdditionalInfo/QuestionAdditionalInfo.skeleton';
+export { ChooseQuestionsDrawerSkeleton } from './ui/ChooseQuestionsDrawer/ChooseQuestionsDrawer.skeleton';
 export { ProgressBlock } from './ui/ProgressBlock/ProgressBlock';
 export { ProgressBlockSkeleton } from './ui/ProgressBlock/ProgressBlock.skeleton';
 export { questionsMock } from './api/__mocks__/data';
diff --git a/src/entities/question/ui/ChooseQuestionsDrawer/ChooseQuestionsDrawer.skeleton.tsx b/src/entities/question/ui/ChooseQuestionsDrawer/ChooseQuestionsDrawer.skeleton.tsx
new file mode 100644
index 000000000..fc45957a4
--- /dev/null
+++ b/src/entities/question/ui/ChooseQuestionsDrawer/ChooseQuestionsDrawer.skeleton.tsx
@@ -0,0 +1,22 @@
+import { ButtonSkeleton } from '@/shared/ui/Button';
+import { Flex } from '@/shared/ui/Flex';
+import { TextSkeleton } from '@/shared/ui/Text';
+
+import styles from './ChooseQuestionsDrawer.module.css';
+
+export const ChooseQuestionsDrawerSkeleton = () => {
+	return (
+		<Flex justify="between">
+			<Flex gap="120">
+				<Flex direction="column" gap="8">
+					<TextSkeleton variant="body4" width={170} />
+					<TextSkeleton variant="body2" width={230} />
+				</Flex>
+				<Flex direction="column" gap="24">
+					<TextSkeleton variant="body3-accent" width={220} />
+				</Flex>
+			</Flex>
+			<ButtonSkeleton className={styles['add-button']} width={174} size="medium" />
+		</Flex>
+	);
+};
diff --git a/src/entities/task/ui/ChooseTasksDrawer/ChooseTasksDrawer.skeleton.tsx b/src/entities/task/ui/ChooseTasksDrawer/ChooseTasksDrawer.skeleton.tsx
new file mode 100644
index 000000000..e45e05996
--- /dev/null
+++ b/src/entities/task/ui/ChooseTasksDrawer/ChooseTasksDrawer.skeleton.tsx
@@ -0,0 +1,22 @@
+import { Flex } from "@/shared/ui/Flex";
+import { TextSkeleton } from "@/shared/ui/Text";
+import { ButtonSkeleton } from "@/shared/ui/Button";
+
+import styles from './ChooseTasksDrawer.module.css';
+
+export const ChooseTasksDrawerSkeleton = () => {
+	return (
+		<Flex justify="between">
+			<Flex gap="120">
+				<Flex direction="column" gap="8">
+					<TextSkeleton variant="body4" width={170} />
+					<TextSkeleton variant="body2" width={230} />
+				</Flex>
+				<Flex direction="column" gap="24">
+					<TextSkeleton variant="body3-accent" width={220} />
+				</Flex>
+			</Flex>
+			<ButtonSkeleton className={styles['add-button']} width={174} size='medium' />
+		</Flex>
+	);
+};
\ No newline at end of file
diff --git a/src/features/collections/createCollection/index.ts b/src/features/collections/createCollection/index.ts
index 21713d5f0..f33c42e5e 100644
--- a/src/features/collections/createCollection/index.ts
+++ b/src/features/collections/createCollection/index.ts
@@ -1,5 +1,4 @@
 export { CollectionCreateForm } from './ui/CollectionCreateForm/CollectionCreateForm';
 export { CollectionCreateFormSkeleton } from './ui/CollectionCreateForm/CollectionCreateForm.skeleton';
 export { getCreateCollectionsApiErrorMessage } from './lib/utils/getCreateCollectionsApiErrorMessage';
-export { CollectionCreateFormHeaderSkeleton } from './ui/CollectionCreateFormHeader/CollectionCreateFormHeader.skeleton';
 export { createCollectionHandlers } from './api/__mocks__';
diff --git a/src/features/collections/createCollection/ui/CollectionCreateForm/CollectionCreateForm.skeleton.tsx b/src/features/collections/createCollection/ui/CollectionCreateForm/CollectionCreateForm.skeleton.tsx
index 7cdb9a98f..5507fc455 100644
--- a/src/features/collections/createCollection/ui/CollectionCreateForm/CollectionCreateForm.skeleton.tsx
+++ b/src/features/collections/createCollection/ui/CollectionCreateForm/CollectionCreateForm.skeleton.tsx
@@ -1,17 +1,17 @@
-import { Card } from '@/shared/ui/Card';
+import { CardSkeleton } from '@/shared/ui/Card';
 import { Flex } from '@/shared/ui/Flex';
 
 import { CollectionFormSkeleton } from '@/entities/collection';
 
-import { CollectionCreateFormHeaderSkeleton } from '@/features/collections/createCollection';
+import { CollectionCreateFormHeaderSkeleton } from '../../ui/CollectionCreateFormHeader/CollectionCreateFormHeader.skeleton';
 
 export const CollectionCreateFormSkeleton = () => {
 	return (
 		<Flex componentType="main" direction="column" gap="24">
 			<CollectionCreateFormHeaderSkeleton />
-			<Card>
+			<CardSkeleton>
 				<CollectionFormSkeleton />
-			</Card>
+			</CardSkeleton>
 		</Flex>
 	);
 };
diff --git a/src/shared/ui/Button/Button.skeleton.tsx b/src/shared/ui/Button/Button.skeleton.tsx
index c1420fa58..7bc626cee 100644
--- a/src/shared/ui/Button/Button.skeleton.tsx
+++ b/src/shared/ui/Button/Button.skeleton.tsx
@@ -13,9 +13,8 @@ export const ButtonSkeleton = ({
 	fullWidth,
 	size = 'medium',
 	destructive,
-	width,
-	height,
-}: ButtonProps & { width?: string | number; height?: string | number }) => {
+	width
+}: ButtonProps & { width?: string | number }) => {
 	const tagName = getTagName(variant);
 
 	return (
@@ -23,7 +22,6 @@ export const ButtonSkeleton = ({
 			dataTestId={dataTestId}
 			borderRadius={12}
 			width={width}
-			height={height}
 			className={classnames(
 				styles[tagName],
 				styles[`${tagName}-${size}`],
diff --git a/src/shared/ui/Flex/Flex.module.css b/src/shared/ui/Flex/Flex.module.css
index b970c4cce..dc1e87554 100644
--- a/src/shared/ui/Flex/Flex.module.css
+++ b/src/shared/ui/Flex/Flex.module.css
@@ -62,6 +62,10 @@
   flex-wrap: nowrap;
 }
 
+.gap2 {
+  gap: 2px;
+}
+
 .gap4 {
   gap: 4px;
 }
@@ -126,6 +130,10 @@
   gap: 52px;
 }
 
+.gap56 {
+  gap: 56px;
+}
+
 .gap60 {
   gap: 60px;
 }
diff --git a/src/shared/ui/Flex/constants.ts b/src/shared/ui/Flex/constants.ts
index bc5cb9612..8755111c0 100644
--- a/src/shared/ui/Flex/constants.ts
+++ b/src/shared/ui/Flex/constants.ts
@@ -29,6 +29,7 @@ export const wrapClasses: Record<FlexWrap, string> = {
 };
 
 export const gapClasses: Record<FlexGap, string> = {
+	'2': styles.gap2,
 	'4': styles.gap4,
 	'6': styles.gap6,
 	'8': styles.gap8,
@@ -45,6 +46,7 @@ export const gapClasses: Record<FlexGap, string> = {
 	'40': styles.gap40,
 	'48': styles.gap48,
 	'52': styles.gap52,
+	'56': styles.gap56,
 	'60': styles.gap60,
 	'100': styles.gap100,
 	'120': styles.gap120,
diff --git a/src/shared/ui/Flex/types.ts b/src/shared/ui/Flex/types.ts
index a4825cc1f..3a6f38973 100644
--- a/src/shared/ui/Flex/types.ts
+++ b/src/shared/ui/Flex/types.ts
@@ -9,6 +9,7 @@ export type FlexWrap = 'wrap' | 'nowrap';
 export type FlexDirection = 'row' | 'column' | 'row-reverse' | 'column-reverse';
 
 export type FlexGap =
+	| '2'
 	| '4'
 	| '6'
 	| '8'
@@ -25,6 +26,7 @@ export type FlexGap =
 	| '40'
 	| '48'
 	| '52'
+	| '56'
 	| '60'
 	| '100'
 	| '120';
diff --git a/src/shared/ui/FormField/FormField.skeleton.tsx b/src/shared/ui/FormField/FormField.skeleton.tsx
index ae73ecd35..bb988296f 100644
--- a/src/shared/ui/FormField/FormField.skeleton.tsx
+++ b/src/shared/ui/FormField/FormField.skeleton.tsx
@@ -6,11 +6,16 @@ import { TextSkeleton } from '@/shared/ui/Text';
 import { FormFieldProps } from './FormField';
 import styles from './FormField.module.css';
 
+interface FormFieldSkeletonProps extends Partial<FormFieldProps> {
+	countTextFields?: number;
+}
+
 export const FormFieldSkeleton = ({
 	children,
 	direction = 'row',
 	isLimitWidth,
-}: Partial<FormFieldProps>) => {
+	countTextFields = 1,
+}: FormFieldSkeletonProps) => {
 	return (
 		<Flex
 			gap={direction === 'row' ? '120' : '20'}
@@ -19,7 +24,11 @@ export const FormFieldSkeleton = ({
 		>
 			<Flex direction="column" className={styles.titles} gap="8">
 				<TextSkeleton variant="body4" width="200px" />
-				<TextSkeleton variant="body2" width="100%" />
+				<Flex direction="column" gap="2">
+					{Array.from({ length: countTextFields }).map((_, index) => (
+						<TextSkeleton key={index} variant="body2" width="100%" />
+					))}
+				</Flex>
 			</Flex>
 			{children}
 		</Flex>
diff --git a/src/shared/ui/ImageLoaderWithoutCropper/ImageLoaderWithoutCropper.module.css b/src/shared/ui/ImageLoaderWithoutCropper/ImageLoaderWithoutCropper.module.css
index 80d8042c9..662a8f90f 100644
--- a/src/shared/ui/ImageLoaderWithoutCropper/ImageLoaderWithoutCropper.module.css
+++ b/src/shared/ui/ImageLoaderWithoutCropper/ImageLoaderWithoutCropper.module.css
@@ -55,6 +55,13 @@
   transform: translate(-50%, -50%);
 }
 
+.file-loader-skeleton {
+  flex: 1 1 458px;
+  min-width: 0;
+  max-width: 458px;
+  min-height: 114px;
+}
+
 @media (width <= 768px) {
   .picture-wrapper {
     flex-wrap: wrap;
diff --git a/src/shared/ui/ImageLoaderWithoutCropper/ImageLoaderWithoutCropper.skeleton.tsx b/src/shared/ui/ImageLoaderWithoutCropper/ImageLoaderWithoutCropper.skeleton.tsx
new file mode 100644
index 000000000..afa6c29f6
--- /dev/null
+++ b/src/shared/ui/ImageLoaderWithoutCropper/ImageLoaderWithoutCropper.skeleton.tsx
@@ -0,0 +1,14 @@
+import { FileLoaderSkeleton } from '../FileLoader';
+import { Flex } from '../Flex';
+import { ImageWithWrapperSkeleton } from '../ImageWithWrapper';
+
+import styles from './ImageLoaderWithoutCropper.module.css';
+
+export const ImageLoaderWithoutCropperSkeleton = () => {
+	return (
+		<Flex gap="32" maxWidth={true}>
+			<ImageWithWrapperSkeleton height={114} width={170} borderRadius={20} />
+			<FileLoaderSkeleton isDragDropEnabled={true} className={styles['file-loader-skeleton']} />
+		</Flex>
+	);
+};
diff --git a/src/shared/ui/ImageLoaderWithoutCropper/index.ts b/src/shared/ui/ImageLoaderWithoutCropper/index.ts
index 5d04d24f5..32f51b42d 100644
--- a/src/shared/ui/ImageLoaderWithoutCropper/index.ts
+++ b/src/shared/ui/ImageLoaderWithoutCropper/index.ts
@@ -1 +1,2 @@
 export { ImageLoaderWithoutCropper } from './ImageLoaderWithoutCropper';
+export { ImageLoaderWithoutCropperSkeleton } from './ImageLoaderWithoutCropper.skeleton';
diff --git a/src/shared/ui/ImageWithWrapper/ImageWithWrapper.skeleton.tsx b/src/shared/ui/ImageWithWrapper/ImageWithWrapper.skeleton.tsx
index 4f91614ad..adb1466fe 100644
--- a/src/shared/ui/ImageWithWrapper/ImageWithWrapper.skeleton.tsx
+++ b/src/shared/ui/ImageWithWrapper/ImageWithWrapper.skeleton.tsx
@@ -2,9 +2,25 @@ import classNames from 'classnames';
 
 import { Skeleton } from '@/shared/ui/Skeleton';
 
-import { ImageWithWrapperProps } from './ImageWithWrapper';
+import { SkeletonBlockProps } from '../Skeleton/Skeleton';
+
 import styles from './ImageWithWrapper.module.css';
 
-export const ImageWithWrapperSkeleton = ({ className }: ImageWithWrapperProps) => {
-	return <Skeleton className={classNames(styles.wrapper, className)} />;
+interface ImageWithWrapperSkeletonProps
+	extends Pick<SkeletonBlockProps, 'className' | 'width' | 'height' | 'borderRadius'> {}
+
+export const ImageWithWrapperSkeleton = ({
+	className,
+	width,
+	height,
+	borderRadius,
+}: ImageWithWrapperSkeletonProps) => {
+	return (
+		<Skeleton
+			className={classNames(styles.wrapper, className)}
+			width={width}
+			height={height}
+			borderRadius={borderRadius}
+		/>
+	);
 };
diff --git a/src/shared/ui/KeywordInput/KeywordInput.skeleton.tsx b/src/shared/ui/KeywordInput/KeywordInput.skeleton.tsx
index 8b3244984..65967d809 100644
--- a/src/shared/ui/KeywordInput/KeywordInput.skeleton.tsx
+++ b/src/shared/ui/KeywordInput/KeywordInput.skeleton.tsx
@@ -8,7 +8,7 @@ export const KeywordInputSkeleton = () => {
 	return (
 		<Flex gap="24" direction="column" align="start">
 			<Flex gap="8">
-				<InputSkeleton size="L" />
+				<InputSkeleton size="L" className={styles.input} />
 				<ButtonSkeleton className={styles.button} />
 			</Flex>
 		</Flex>
diff --git a/src/shared/ui/SelectWithChips/SelectWithChips.skeleton.tsx b/src/shared/ui/SelectWithChips/SelectWithChips.skeleton.tsx
new file mode 100644
index 000000000..7cbc1d848
--- /dev/null
+++ b/src/shared/ui/SelectWithChips/SelectWithChips.skeleton.tsx
@@ -0,0 +1,5 @@
+import { SelectSkeleton } from '../Dropdown/Select/Select.skeleton';
+
+export const SelectWithChipsSkeleton = () => {
+	return <SelectSkeleton size="L" />;
+};
diff --git a/src/shared/ui/SelectWithChips/index.ts b/src/shared/ui/SelectWithChips/index.ts
index 1ea53885c..6d8dadf2f 100644
--- a/src/shared/ui/SelectWithChips/index.ts
+++ b/src/shared/ui/SelectWithChips/index.ts
@@ -1,3 +1,3 @@
 export { SelectWithChips } from './SelectWithChips';
-
+export { SelectWithChipsSkeleton } from './SelectWithChips.skeleton';
 export { selectWithChipsTestIds } from './constants';
diff --git a/src/shared/ui/Skeleton/Skeleton.tsx b/src/shared/ui/Skeleton/Skeleton.tsx
index a90cda6c1..b873a8a64 100644
--- a/src/shared/ui/Skeleton/Skeleton.tsx
+++ b/src/shared/ui/Skeleton/Skeleton.tsx
@@ -5,7 +5,7 @@ import styles from './Skeleton.module.css';
 
 type SkeletonVariant = 'default' | 'blur';
 
-interface SkeletonBlockProps {
+export interface SkeletonBlockProps {
 	width?: string | number;
 	height?: string | number;
 	borderRadius?: string | number;
diff --git a/src/shared/ui/TextArea/TextArea.skeleton.tsx b/src/shared/ui/TextArea/TextArea.skeleton.tsx
new file mode 100644
index 000000000..19e8dbca9
--- /dev/null
+++ b/src/shared/ui/TextArea/TextArea.skeleton.tsx
@@ -0,0 +1,18 @@
+import { Skeleton } from '../Skeleton';
+import type { SkeletonBlockProps } from '../Skeleton/Skeleton';
+
+type TextAreaSkeletonProps = Pick<
+	SkeletonBlockProps,
+	'width' | 'height' | 'className' | 'borderRadius'
+>;
+
+export const TextAreaSkeleton = ({
+	width,
+	height,
+	className,
+	borderRadius,
+}: TextAreaSkeletonProps) => {
+	return (
+		<Skeleton className={className} width={width} height={height} borderRadius={borderRadius} />
+	);
+};
diff --git a/src/shared/ui/TextArea/index.ts b/src/shared/ui/TextArea/index.ts
index fdf76b35f..48d91fdc6 100644
--- a/src/shared/ui/TextArea/index.ts
+++ b/src/shared/ui/TextArea/index.ts
@@ -1 +1,2 @@
 export { TextArea } from './TextArea';
+export { TextAreaSkeleton } from './TextArea.skeleton';

From 3c15ff64621583bef9d1c95aa5f49b77f3908628 Mon Sep 17 00:00:00 2001
From: Alexandr Novosyolov <aain34@mail.ru>
Date: Sat, 13 Jun 2026 13:48:32 +0300
Subject: [PATCH 3/3] YH-2049: remove comment, change export

---
 .../CollectionForm/CollectionForm.module.css  |  1 -
 .../CollectionForm.skeleton.tsx               | 20 +++++++++----------
 src/entities/company/@x/collection.ts         |  1 +
 src/entities/question/@x/collection.ts        |  1 +
 src/entities/specialization/@x/collection.ts  |  1 +
 src/entities/task/@x/collection.ts            |  1 +
 src/entities/task/index.ts                    |  2 +-
 .../task/ui/ChooseTasksDrawer/index.ts        |  1 +
 8 files changed, 16 insertions(+), 12 deletions(-)

diff --git a/src/entities/collection/ui/CollectionForm/CollectionForm.module.css b/src/entities/collection/ui/CollectionForm/CollectionForm.module.css
index 7c63b2aed..f635d883f 100644
--- a/src/entities/collection/ui/CollectionForm/CollectionForm.module.css
+++ b/src/entities/collection/ui/CollectionForm/CollectionForm.module.css
@@ -23,7 +23,6 @@
   max-width: 408px;
 }
 
-/* Skeleton */
 .skeleton-form-field {
   height: 48px;
 }
diff --git a/src/entities/collection/ui/CollectionForm/CollectionForm.skeleton.tsx b/src/entities/collection/ui/CollectionForm/CollectionForm.skeleton.tsx
index 498489bdc..2eeb2f384 100644
--- a/src/entities/collection/ui/CollectionForm/CollectionForm.skeleton.tsx
+++ b/src/entities/collection/ui/CollectionForm/CollectionForm.skeleton.tsx
@@ -1,19 +1,20 @@
 import { Flex } from '@/shared/ui/Flex';
 import { FormControlSkeleton } from '@/shared/ui/FormControl';
 import { FormFieldSkeleton } from '@/shared/ui/FormField';
+import { ImageLoaderWithoutCropperSkeleton } from '@/shared/ui/ImageLoaderWithoutCropper';
 import { InputSkeleton } from '@/shared/ui/Input';
+import { KeywordInputSkeleton } from '@/shared/ui/KeywordInput';
+import { KeywordSelectSkeleton } from '@/shared/ui/KeywordSelect';
+import { RadioSkeleton } from '@/shared/ui/Radio';
 import { TextSkeleton } from '@/shared/ui/Text';
 import { TextAreaSkeleton } from '@/shared/ui/TextArea';
-import { ImageLoaderWithoutCropperSkeleton } from '@/shared/ui/ImageLoaderWithoutCropper';
-import { KeywordSelectSkeleton } from '@/shared/ui/KeywordSelect';
-import { KeywordInputSkeleton } from '@/shared/ui/KeywordInput';
-import { ChooseQuestionsDrawerSkeleton } from '@/entities/question';
-import { SpecializationSelectSkeleton } from '@/entities/specialization';
+
+import { CompanySelectSkeleton } from '@/entities/company/@x/collection';
+import { ChooseQuestionsDrawerSkeleton } from '@/entities/question/@x/collection';
+import { SpecializationSelectSkeleton } from '@/entities/specialization/@x/collection';
+import { ChooseTasksDrawerSkeleton } from '@/entities/task/@x/collection';
 
 import styles from './CollectionForm.module.css';
-import { CompanySelectSkeleton } from '@/entities/company';
-import { RadioSkeleton } from '@/shared/ui/Radio';
-import { ChooseTasksDrawerSkeleton } from '@/entities/task/ui/ChooseTasksDrawer/ChooseTasksDrawer.skeleton';
 
 export const CollectionFormSkeleton = () => {
 	return (
@@ -21,7 +22,6 @@ export const CollectionFormSkeleton = () => {
 			<TextSkeleton width={160} variant="body5" />
 
 			<Flex direction="column" gap="60">
-
 				<FormFieldSkeleton>
 					<FormControlSkeleton className={styles['skeleton-form-field']}>
 						<InputSkeleton size="L" />
@@ -34,7 +34,7 @@ export const CollectionFormSkeleton = () => {
 					</FormControlSkeleton>
 				</FormFieldSkeleton>
 
-				<FormFieldSkeleton direction="column" >
+				<FormFieldSkeleton direction="column">
 					<FormControlSkeleton>
 						<TextAreaSkeleton
 							className={styles['skeleton-textarea']}
diff --git a/src/entities/company/@x/collection.ts b/src/entities/company/@x/collection.ts
index 2ebb689d7..9ecd72795 100644
--- a/src/entities/company/@x/collection.ts
+++ b/src/entities/company/@x/collection.ts
@@ -1,2 +1,3 @@
 export type { Company } from '../model/types/companyTypes';
 export { CompanySelect } from '../ui/CompanySelect/CompanySelect';
+export { CompanySelectSkeleton } from '../ui/CompanySelect/CompanySelect.skeleton';
diff --git a/src/entities/question/@x/collection.ts b/src/entities/question/@x/collection.ts
index 6e651a784..51846e8a3 100644
--- a/src/entities/question/@x/collection.ts
+++ b/src/entities/question/@x/collection.ts
@@ -1,3 +1,4 @@
 export type { Question, GeneratedQuestionDto } from '../model/types/question';
 export { ChooseQuestionsDrawer } from '../ui/ChooseQuestionsDrawer/ChooseQuestionsDrawer';
+export { ChooseQuestionsDrawerSkeleton } from '../ui/ChooseQuestionsDrawer/ChooseQuestionsDrawer.skeleton';
 export { GENERATED_QUESTIONS_LS_KEY } from '../model/constants/question';
diff --git a/src/entities/specialization/@x/collection.ts b/src/entities/specialization/@x/collection.ts
index aa0bbee5a..569669fe9 100644
--- a/src/entities/specialization/@x/collection.ts
+++ b/src/entities/specialization/@x/collection.ts
@@ -1,2 +1,3 @@
 export type { Specialization } from '../model/types/specialization';
 export { SpecializationSelect } from '../ui/SpecializationSelect/SpecializationSelect';
+export { SpecializationSelectSkeleton } from '../ui/SpecializationSelect/SpecializationSelect.skeleton';
diff --git a/src/entities/task/@x/collection.ts b/src/entities/task/@x/collection.ts
index c16fa80b0..f1591792c 100644
--- a/src/entities/task/@x/collection.ts
+++ b/src/entities/task/@x/collection.ts
@@ -1,2 +1,3 @@
 export { ChooseTasksDrawer } from '../ui/ChooseTasksDrawer';
+export { ChooseTasksDrawerSkeleton } from '../ui/ChooseTasksDrawer/ChooseTasksDrawer.skeleton';
 export type { Task } from '../model/types/task';
diff --git a/src/entities/task/index.ts b/src/entities/task/index.ts
index 0ba120e10..f140fc716 100644
--- a/src/entities/task/index.ts
+++ b/src/entities/task/index.ts
@@ -36,7 +36,7 @@ export { TaskCategorySelectSkeleton } from './ui/TaskCategorySelect/TaskCategory
 export { TaskStructuresField } from './ui/TaskStructuresField/TaskStructuresField';
 export { TaskCategoryFilterList } from './ui/TaskCategoryFilterList/TaskCategoryFilterList';
 export { taskCategories } from './model/constants/task';
-export { ChooseTasksDrawer } from './ui/ChooseTasksDrawer';
+export { ChooseTasksDrawer, ChooseTasksDrawerSkeleton } from './ui/ChooseTasksDrawer';
 export { taskHandlers } from './api/__mocks__';
 export { TaskCardSkeleton } from './ui/TaskCard/TaskCard.skeleton';
 export { TaskCategoryFilterListSkeleton } from './ui/TaskCategoryFilterList/TaskCategoryFilterList.skeleton';
diff --git a/src/entities/task/ui/ChooseTasksDrawer/index.ts b/src/entities/task/ui/ChooseTasksDrawer/index.ts
index b0f894edd..1f27b1f4c 100644
--- a/src/entities/task/ui/ChooseTasksDrawer/index.ts
+++ b/src/entities/task/ui/ChooseTasksDrawer/index.ts
@@ -1 +1,2 @@
 export { ChooseTasksDrawer } from './ChooseTasksDrawer';
+export { ChooseTasksDrawerSkeleton } from './ChooseTasksDrawer.skeleton';