{t('basket.total')}
diff --git a/src/components/basket-total/style.css b/src/components/basket-total/style.css
index 1d2879d8f..85a6a4681 100644
--- a/src/components/basket-total/style.css
+++ b/src/components/basket-total/style.css
@@ -12,3 +12,15 @@
font-weight: bold;
white-space: nowrap;
}
+
+.Cart-empty{
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ flex-direction: column;
+ gap: 15px;
+}
+
+.Cart-empty img{
+ width: 100px;
+}
\ No newline at end of file
diff --git a/src/components/category-select/index.js b/src/components/category-select/index.js
new file mode 100644
index 000000000..857c64ef9
--- /dev/null
+++ b/src/components/category-select/index.js
@@ -0,0 +1,36 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import CustomSelect from '../select';
+import Spinner from '../spinner';
+import { useCategories } from '../../hooks/use-categories';
+
+const CategorySelect = ({ value, onChange, placeholder }) => {
+ const { options, loading } = useCategories();
+
+ if (loading) {
+ return
;
+ }
+
+ return (
+
{
+ const found = options.find(opt => opt.value === selectedValue);
+ if (found) {
+ onChange(found);
+ }
+ }}
+ placeholder={placeholder}
+ size="medium"
+ />
+ );
+};
+
+CategorySelect.propTypes = {
+ value: PropTypes.any,
+ onChange: PropTypes.func.isRequired,
+ placeholder: PropTypes.string,
+};
+
+export default CategorySelect;
diff --git a/src/components/comments-section/index.js b/src/components/comments-section/index.js
new file mode 100644
index 000000000..628bdd15b
--- /dev/null
+++ b/src/components/comments-section/index.js
@@ -0,0 +1,166 @@
+import { Link } from 'react-router-dom';
+import React, { useEffect, useRef } from 'react';
+import { useNavigate } from 'react-router-dom';
+import PropTypes from 'prop-types';
+import Button from '../button';
+import './style.css';
+
+function CommentItem({comment, replyTo, text, onTextChange, onReplyClick, onSubmit, isAuthorized}) {
+
+ const isChild = (comment.level || 0) > 0;
+ const level = comment.level ?? 0;
+ const base_padding = 40;
+ const max_level = 4;
+ const extra_padding = -30;
+
+ const indentPx =
+ level <= max_level
+ ? level * base_padding
+ : max_level * base_padding + (level - max_level) * extra_padding;
+
+ const navigate = useNavigate();
+
+
+ const handleReply = () => {
+ if (isAuthorized) {
+ onReplyClick(comment.id);
+ } else {
+ navigate('/login', { state: { back: window.location.pathname } });
+ }
+ };
+
+ const replyRef = useRef(null);
+
+ useEffect(() => {
+ if (replyTo === comment.id && replyRef.current) {
+ replyRef.current.scrollIntoView({
+ behavior: 'smooth',
+ block: 'center'
+ });
+ }
+ }, [replyTo, comment.id]);
+
+ return (
+
+
+
+ {comment.author}
+
+
+ {new Date(comment.date).toLocaleString()}
+
+
+
{comment.text}
+
+
+
+ {comment.replies.length > 0 && (
+
+ {comment.replies.map(child => (
+
+ ))}
+
+ )}
+
+ {/* Форма ответа */}
+ {isAuthorized && replyTo === comment.id && (
+