diff --git a/.eslintrc.json b/.eslintrc.json new file mode 100644 index 0000000000..58ee06e7df --- /dev/null +++ b/.eslintrc.json @@ -0,0 +1,17 @@ +{ + "env": { + "browser": true, + "es2021": true + }, + "extends": ["eslint:recommended", "prettier"], + "parserOptions": { + "ecmaVersion": 12, + "sourceType": "module" + }, + "rules": { + "no-console": "warn", + "no-unused-vars": "warn", + "no-var": "error", + "prefer-const": "error" + } +} diff --git a/.github/workflows/greetings.yml b/.github/workflows/greetings.yml index 7e8e44c046..c37fcf8ddc 100644 --- a/.github/workflows/greetings.yml +++ b/.github/workflows/greetings.yml @@ -9,7 +9,7 @@ jobs: if: github.repository == 'GlebkaF/webdev-dom-homework' runs-on: ubuntu-latest steps: - - uses: superbrothers/close-pull-request@v3 - with: - # Optional. Post a issue comment just before closing a pull request. - comment: "Привет! Сделай пожалуйста Pull Request в свой репозиторий, сейчас ты сделал PR в репозиторий Глеба. Посмотри в домашке, там на скриншоте нарисовано где выбрать свой репозиторий" + - uses: superbrothers/close-pull-request@v3 + with: + # Optional. Post a issue comment just before closing a pull request. + comment: 'Привет! Сделай пожалуйста Pull Request в свой репозиторий, сейчас ты сделал PR в репозиторий Глеба. Посмотри в домашке, там на скриншоте нарисовано где выбрать свой репозиторий' diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000000..d0c91ee108 --- /dev/null +++ b/.gitignore @@ -0,0 +1,14 @@ +node_modules/ + +.env + +*.log + +.vscode/ +.idea/ + +dist/ +coverage/ + +.DS_Store +Thumbs.db \ No newline at end of file diff --git a/.hintrc b/.hintrc new file mode 100644 index 0000000000..aa8de6b4ec --- /dev/null +++ b/.hintrc @@ -0,0 +1,5 @@ +{ + "extends": [ + "development" + ] +} \ No newline at end of file diff --git a/.prettierrc b/.prettierrc new file mode 100644 index 0000000000..785de29307 --- /dev/null +++ b/.prettierrc @@ -0,0 +1,7 @@ +{ + "semi": true, + "singleQuote": true, + "trailingComma": "es5", + "tabWidth": 2, + "printWidth": 100 +} diff --git a/api.js b/api.js new file mode 100644 index 0000000000..635404dc45 --- /dev/null +++ b/api.js @@ -0,0 +1,185 @@ +const PERSONAL_KEY = 'nikandrov-danil'; +const BASE_URL = `https://wedev-api.sky.pro/api/v2/${PERSONAL_KEY}`; +const AUTH_URL = `https://wedev-api.sky.pro/api/user`; + +export let token = null; +export let user = null; + +export const setToken = (newToken) => { + token = newToken; + if (newToken) { + localStorage.setItem('token', newToken); + } else { + localStorage.removeItem('token'); + } +}; + +export const setUser = (newUser) => { + user = newUser; + if (newUser) { + localStorage.setItem('user', JSON.stringify(newUser)); + } else { + localStorage.removeItem('user'); + } +}; + +export const getToken = () => { + return token || localStorage.getItem('token'); +}; + +export const getUser = () => { + try { + if (user) return user; + + const userData = localStorage.getItem('user'); + + if (!userData) return null; + + return JSON.parse(userData); + } catch (error) { + console.error('Ошибка при получении пользователя из localStorage:', error); + localStorage.removeItem('user'); + return null; + } +}; + +export const removeAuthData = () => { + token = null; + user = null; + localStorage.removeItem('token'); + localStorage.removeItem('user'); +}; + +export const getComments = async () => { + try { + const response = await fetch(`${BASE_URL}/comments`); + + if (!response.ok) { + if (response.status === 500) { + throw new Error('Сервер сломался, попробуй позже'); + } else { + throw new Error('Ошибка сервера'); + } + } + + const data = await response.json(); + + return data.comments.map(comment => ({ + id: comment.id, + name: comment.author.name, + text: comment.text, + likes: comment.likes || 0, + isLiked: comment.isLiked || false, + date: new Date(comment.date).getTime() + })); + } catch (error) { + if (error.message === 'Failed to fetch') { + throw new Error('Кажется, у вас сломался интернет, попробуйте позже'); + } + throw error; + } +}; + +export const postComment = async (text) => { + const currentToken = getToken(); + + if (!currentToken) { + throw new Error('Ошибка авторизации'); + } + + try { + const response = await fetch(`${BASE_URL}/comments`, { + method: 'POST', + headers: { + Authorization: `Bearer ${currentToken}`, + 'Content-Type': 'application/json', + }, + body: JSON.stringify({ + text, + }), + }); + + if (!response.ok) { + if (response.status === 400) { + const errorData = await response.json(); + throw new Error(errorData.error || 'Комментарий должен быть не короче 3 символов'); + } else if (response.status === 500) { + throw new Error('Сервер сломался, попробуй позже'); + } else if (response.status === 401) { + throw new Error('Ошибка авторизации'); + } else { + throw new Error('Ошибка сервера'); + } + } + + return await getComments(); + } catch (error) { + if (error.message === 'Failed to fetch') { + throw new Error('Кажется, у вас сломался интернет, попробуйте позже'); + } + throw error; + } +}; + +export const login = async ({ login, password }) => { + try { + const response = await fetch(`${AUTH_URL}/login`, { + method: 'POST', + body: JSON.stringify({ + login, + password, + }), + }); + + const data = await response.json(); + + if (!response.ok) { + if (response.status === 400) { + throw new Error(data.error || 'Неверный логин или пароль'); + } else { + throw new Error(data.error || 'Ошибка сервера'); + } + } + + setToken(data.user.token); + setUser(data.user); + return data; + } catch (error) { + if (error.message === 'Failed to fetch') { + throw new Error('Кажется, у вас сломался интернет, попробуйте позже'); + } + throw error; + } +}; + +export const register = async ({ name, login, password }) => { + try { + const response = await fetch(AUTH_URL, { + method: 'POST', + body: JSON.stringify({ + name, + login, + password, + }), + }); + + const data = await response.json(); + + if (!response.ok) { + if (response.status === 400) { + throw new Error(data.error || 'Пользователь с таким логином уже существует'); + } else { + throw new Error(data.error || 'Ошибка сервера'); + } + } + + setToken(data.user.token); + setUser(data.user); + return data; + } catch (error) { + if (error.message === 'Failed to fetch') { + throw new Error('Кажется, у вас сломался интернет, попробуйте позже'); + } + throw error; + } +}; \ No newline at end of file diff --git a/db.json b/db.json new file mode 100644 index 0000000000..dcb91abe94 --- /dev/null +++ b/db.json @@ -0,0 +1,40 @@ +{ + "comments": [ + { + "id": "1", + "name": "Тестовый пользователь", + "text": "Это первый комментарий!", + "date": "28.07.2025, 11:00:00", + "likes": 1, + "isLiked": true, + "replyTo": null + }, + { + "id": "2", + "name": "Второй пользователь", + "text": "Работает отлично!", + "date": "29.07.2025, 12:00:00", + "likes": 1, + "isLiked": true, + "replyTo": null + }, + { + "id": "60c1", + "name": "tretiy", + "text": "ya tyta", + "date": "29.07.2025, 21:25:16", + "likes": 1, + "isLiked": true, + "replyTo": null + }, + { + "id": "a6d3", + "name": "Данил", + "text": "не работают лайки :((((((((", + "date": "29.07.2025, 21:30:21", + "likes": 0, + "isLiked": false, + "replyTo": null + } + ] +} \ No newline at end of file diff --git a/escapeHTML.js b/escapeHTML.js new file mode 100644 index 0000000000..9ef7611171 --- /dev/null +++ b/escapeHTML.js @@ -0,0 +1,11 @@ +function escapeHTML(str) { + if (!str) return ''; + return str + .replaceAll('&', '&') + .replaceAll('<', '<') + .replaceAll('>', '>') + .replaceAll('"', '"') + .replaceAll("'", '''); +} + +export { escapeHTML }; \ No newline at end of file diff --git a/eventHandlers.js b/eventHandlers.js new file mode 100644 index 0000000000..ca44105440 --- /dev/null +++ b/eventHandlers.js @@ -0,0 +1,81 @@ +import { escapeHTML } from './escapeHTML.js'; +import { getToken } from './api.js'; +import { renderLoginComponent } from './login.js'; + +export function initHandlers({ onAddComment, onToggleLike, onReply, onRetry, onInputChange }) { + const commentInput = document.querySelector('.add-form-text'); + const addButton = document.querySelector('.add-form-button'); + const commentsList = document.querySelector('.comments'); + const appEl = document.getElementById('app'); + + const checkInputs = () => { + if (addButton) { + addButton.disabled = !commentInput.value.trim(); + } + if (onInputChange) onInputChange(); + }; + + if (commentsList) { + commentsList.addEventListener('click', (event) => { + if (event.target.classList.contains('retry-btn')) { + onRetry(); + return; + } + + if (event.target.classList.contains('like-button')) { + event.preventDefault(); + const commentElement = event.target.closest('.comment'); + if (!commentElement) return; + + const commentId = commentElement.dataset.id; + onToggleLike(commentId); + return; + } + + if (event.target.classList.contains('comment-reply')) { + event.preventDefault(); + const commentElement = event.target.closest('.comment'); + if (!commentElement) return; + + const author = commentElement.querySelector('.comment-author').textContent; + const text = commentElement.querySelector('.comment-body').textContent; + onReply(author, text); + return; + } + }); + } + + if (addButton && commentInput) { + addButton.addEventListener('click', (event) => { + event.preventDefault(); + + const text = commentInput.value.trim(); + + if (text.length < 3) { + alert('Комментарий должен быть не короче 3 символов'); + return; + } + + onAddComment({ + text: escapeHTML(text) + }); + }); + + commentInput.addEventListener('input', checkInputs); + } + + const authLink = document.getElementById('auth-link'); + if (authLink) { + authLink.addEventListener('click', (event) => { + event.preventDefault(); + renderLoginComponent({ + appEl, + onSuccess: () => { + window.location.reload(); + } + }); + }); + } + + checkInputs(); +} \ No newline at end of file diff --git a/formatDate.js b/formatDate.js new file mode 100644 index 0000000000..b9b8be75cb --- /dev/null +++ b/formatDate.js @@ -0,0 +1,11 @@ +export function formatDate(dateString) { + const date = new Date(dateString); + return date.toLocaleString('ru-RU', { + day: '2-digit', + month: '2-digit', + year: 'numeric', + hour: '2-digit', + minute: '2-digit', + second: '2-digit' + }); +} \ No newline at end of file diff --git a/index.html b/index.html index 6f14ae14aa..8ca5932503 100644 --- a/index.html +++ b/index.html @@ -1,71 +1,13 @@ - - + + Проект "Комменты" - + + - - - -
- -
- - -
- -
-
-
- - - + + +
+ + diff --git a/launch.json b/launch.json new file mode 100644 index 0000000000..9153b3d90b --- /dev/null +++ b/launch.json @@ -0,0 +1,14 @@ +{ + // Use IntelliSense to learn about possible attributes. + // Hover to view descriptions of existing attributes. + // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 + "version": "0.2.0", + "configurations": [ + { + "type": "msedge", + "request": "launch", + "name": "Open index.html", + "file": "d:\\VSCcode\\webdev-dom-homework\\index.html" + } + ] +} \ No newline at end of file diff --git a/login.js b/login.js new file mode 100644 index 0000000000..6535d40f04 --- /dev/null +++ b/login.js @@ -0,0 +1,124 @@ +import { login, register } from './api.js'; + +export function renderLoginComponent({ appEl, onSuccess }) { + let isLoginMode = true; + let errorMessage = ''; + let isLoading = false; + + const renderForm = () => { + const appHtml = ` +
+
+

${isLoginMode ? 'Вход' : 'Регистрация'}

+ + ${errorMessage ? `
${errorMessage}
` : ''} + + ${isLoginMode ? '' : ` + + `} + + + + + +
+ +
+ + +
+
+ `; + + appEl.innerHTML = appHtml; + + document.getElementById('login-button').addEventListener('click', () => { + if (isLoading) return; + + if (isLoginMode) { + const loginValue = document.getElementById('login-input').value; + const password = document.getElementById('password-input').value; + + if (!loginValue || !password) { + errorMessage = 'Введите логин и пароль'; + renderForm(); + return; + } + + isLoading = true; + renderForm(); + + login({ login: loginValue, password }) + .then(() => { + onSuccess(); + }) + .catch((error) => { + errorMessage = error.message; + isLoading = false; + renderForm(); + }); + } else { + const name = document.getElementById('name-input').value; + const loginValue = document.getElementById('login-input').value; + const password = document.getElementById('password-input').value; + + if (!name || !loginValue || !password) { + errorMessage = 'Введите имя, логин и пароль'; + renderForm(); + return; + } + + isLoading = true; + renderForm(); + + register({ name, login: loginValue, password }) + .then(() => { + onSuccess(); + }) + .catch((error) => { + errorMessage = error.message; + isLoading = false; + renderForm(); + }); + } + }); + + document.getElementById('toggle-link').addEventListener('click', (event) => { + event.preventDefault(); + if (isLoading) return; + + isLoginMode = !isLoginMode; + errorMessage = ''; + renderForm(); + }); + }; + + renderForm(); +} \ No newline at end of file diff --git a/main.js b/main.js new file mode 100644 index 0000000000..3f5f88ed27 --- /dev/null +++ b/main.js @@ -0,0 +1,258 @@ +import { renderComments } from './renderComments.js'; +import { initHandlers } from './eventHandlers.js'; +import { getComments, postComment, getToken, getUser, removeAuthData } from './api.js'; +import { renderLoginComponent } from './login.js'; + +function delay(interval = 300) { + return new Promise((resolve) => { + setTimeout(() => resolve(), interval); + }); +} + +function disablePageScroll() { + document.body.classList.add('-noscroll'); + window.scrollTo(0, window.pageYOffset); +} + +function enablePageScroll() { + document.body.classList.remove('-noscroll'); +} + +let comments = []; +let isLoading = false; +let error = null; +let formData = { text: '' }; + +const loadComments = async () => { + isLoading = true; + renderApp(); + + try { + comments = await getComments(); + error = null; + } catch (err) { + console.error('Failed to load comments:', err); + error = err; + + if (err.message === 'Сервер сломался, попробуй позже') { + alert('Сервер сломался, попробуй позже'); + } else if (err.message === 'Кажется, у вас сломался интернет, попробуйте позже') { + alert('Кажется, у вас сломался интернет, попробуйте позже'); + } + } finally { + isLoading = false; + renderApp(); + } +}; + +function setFormDisabled(disabled) { + const addButton = document.querySelector('.add-form-button'); + const commentInput = document.querySelector('.add-form-text'); + const addForm = document.querySelector('.add-form'); + + if (addButton) { + addButton.disabled = disabled; + addButton.textContent = disabled ? 'Отправка...' : 'Написать'; + } + + if (commentInput) commentInput.disabled = disabled; + + if (addForm) { + if (disabled) { + addForm.classList.add('-loading'); + disablePageScroll(); + } else { + addForm.classList.remove('-loading'); + enablePageScroll(); + } + } +} + +function saveFormData() { + const commentInput = document.querySelector('.add-form-text'); + if (commentInput) formData.text = commentInput.value; +} + +function restoreFormData() { + const commentInput = document.querySelector('.add-form-text'); + if (commentInput) commentInput.value = formData.text; +} + +function renderApp() { + const appEl = document.getElementById('app'); + const token = getToken(); + const user = getUser(); + + if (!token) { + renderLoginComponent({ + appEl, + onSuccess: () => { + loadComments(); + renderApp(); + } + }); + return; + } + + const appHtml = ` +
+ + +
+
+
Комментарий добавляется...
+
+ + +
+ + +
+
+
+ `; + + appEl.innerHTML = appHtml; + + const commentsList = document.querySelector('.comments'); + renderComments(comments, isLoading, error, formData, commentsList); + + const logoutButton = document.querySelector('.logout-button'); + if (logoutButton) { + logoutButton.addEventListener('click', () => { + removeAuthData(); + renderApp(); + }); + } + + initHandlers({ + onAddComment: async (newComment) => { + const startTime = Date.now(); + setFormDisabled(true); + saveFormData(); + + try { + const user = getUser(); + const tempComment = { + id: 'temp-' + Date.now(), + name: user.name, + text: newComment.text, + date: Date.now(), + likes: 0, + isLiked: false, + isSending: true + }; + + comments = [...comments, tempComment]; + renderApp(); + + const updatedComments = await postComment(newComment.text); + + const elapsed = Date.now() - startTime; + const remainingDelay = Math.max(2000 - elapsed, 0); + await delay(remainingDelay); + + comments = updatedComments; + error = null; + formData = { text: '' }; + + } catch (err) { + console.error('Failed to post comment:', err); + error = err; + + if (err.message.includes('не короче 3 символов')) { + alert('Комментарий должен быть не короче 3 символов'); + } else if (err.message === 'Сервер сломался, попробуй позже') { + alert('Сервер сломался, попробуй позже'); + } else if (err.message === 'Кажется, у вас сломался интернет, попробуйте позже') { + alert('Кажется, у вас сломался интернет, попробуйте позже'); + } else if (err.message === 'Ошибка авторизации') { + alert('Ошибка авторизации'); + removeAuthData(); + renderApp(); + } + + comments = comments.filter(c => !c.isSending); + } finally { + setFormDisabled(false); + restoreFormData(); + renderApp(); + } + }, + + onToggleLike: async (commentId) => { + const commentIndex = comments.findIndex(c => c.id == commentId); + if (commentIndex === -1) return; + + const updatedComments = [...comments]; + const comment = updatedComments[commentIndex]; + + updatedComments[commentIndex] = { + ...comment, + isLikeLoading: true + }; + + comments = updatedComments; + renderApp(); + + try { + await delay(1000); + + const finalComments = [...comments]; + finalComments[commentIndex] = { + ...comment, + isLiked: !comment.isLiked, + likes: comment.isLiked ? comment.likes - 1 : comment.likes + 1, + isLikeLoading: false + }; + + comments = finalComments; + error = null; + } catch (err) { + console.error('Ошибка при обновлении лайка:', err); + error = err; + + const restoredComments = [...comments]; + restoredComments[commentIndex] = { + ...comment, + isLikeLoading: false + }; + comments = restoredComments; + } finally { + renderApp(); + } + }, + + onRetry: loadComments, + + onReply: (author, text) => { + const commentInput = document.querySelector('.add-form-text'); + formData.text = `> ${author}: ${text}\n\n${formData.text}`; + restoreFormData(); + if (commentInput) commentInput.focus(); + }, + + onInputChange: () => { + saveFormData(); + } + }); +} + +document.addEventListener('DOMContentLoaded', () => { + const appEl = document.createElement('div'); + appEl.id = 'app'; + document.body.appendChild(appEl); + + renderApp(); + loadComments(); +}); diff --git a/package-lock.json b/package-lock.json new file mode 100644 index 0000000000..caef968459 --- /dev/null +++ b/package-lock.json @@ -0,0 +1,1120 @@ +{ + "name": "comments-project", + "version": "1.0.0", + "lockfileVersion": 3, + "requires": true, + "packages": { + "": { + "name": "comments-project", + "version": "1.0.0", + "devDependencies": { + "eslint": "^9.31.0", + "eslint-config-prettier": "^10.1.5", + "prettier": "^3.6.2" + } + }, + "node_modules/@eslint-community/eslint-utils": { + "version": "4.7.0", + "resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.7.0.tgz", + "integrity": "sha512-dyybb3AcajC7uha6CvhdVRJqaKyn7w2YKqKyAN37NKYgZT36w+iRb0Dymmc5qEJ549c/S31cMMSFd75bteCpCw==", + "dev": true, + "license": "MIT", + "dependencies": { + "eslint-visitor-keys": "^3.4.3" + }, + "engines": { + "node": "^12.22.0 || ^14.17.0 || >=16.0.0" + }, + "funding": { + "url": "https://opencollective.com/eslint" + }, + "peerDependencies": { + "eslint": "^6.0.0 || ^7.0.0 || >=8.0.0" + } + }, + "node_modules/@eslint-community/eslint-utils/node_modules/eslint-visitor-keys": { + "version": "3.4.3", + "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-3.4.3.tgz", + "integrity": "sha512-wpc+LXeiyiisxPlEkUzU6svyS1frIO3Mgxj1fdy7Pm8Ygzguax2N3Fa/D/ag1WqbOprdI+uY6wMUl8/a2G+iag==", + "dev": true, + "license": "Apache-2.0", + "engines": { + "node": "^12.22.0 || ^14.17.0 || >=16.0.0" + }, + "funding": { + "url": "https://opencollective.com/eslint" + } + }, + "node_modules/@eslint-community/regexpp": { + "version": "4.12.1", + "resolved": "https://registry.npmjs.org/@eslint-community/regexpp/-/regexpp-4.12.1.tgz", + "integrity": "sha512-CCZCDJuduB9OUkFkY2IgppNZMi2lBQgD2qzwXkEia16cge2pijY/aXi96CJMquDMn3nJdlPV1A5KrJEXwfLNzQ==", + "dev": true, + "license": "MIT", + "engines": { + "node": "^12.0.0 || ^14.0.0 || >=16.0.0" + } + }, + "node_modules/@eslint/config-array": { + "version": "0.21.0", + "resolved": "https://registry.npmjs.org/@eslint/config-array/-/config-array-0.21.0.tgz", + "integrity": "sha512-ENIdc4iLu0d93HeYirvKmrzshzofPw6VkZRKQGe9Nv46ZnWUzcF1xV01dcvEg/1wXUR61OmmlSfyeyO7EvjLxQ==", + "dev": true, + "license": "Apache-2.0", + "dependencies": { + "@eslint/object-schema": "^2.1.6", + "debug": "^4.3.1", + "minimatch": "^3.1.2" + }, + "engines": { + "node": "^18.18.0 || ^20.9.0 || >=21.1.0" + } + }, + "node_modules/@eslint/config-helpers": { + "version": "0.3.0", + "resolved": "https://registry.npmjs.org/@eslint/config-helpers/-/config-helpers-0.3.0.tgz", + "integrity": "sha512-ViuymvFmcJi04qdZeDc2whTHryouGcDlaxPqarTD0ZE10ISpxGUVZGZDx4w01upyIynL3iu6IXH2bS1NhclQMw==", + "dev": true, + "license": "Apache-2.0", + "engines": { + "node": "^18.18.0 || ^20.9.0 || >=21.1.0" + } + }, + "node_modules/@eslint/core": { + "version": "0.15.1", + "resolved": "https://registry.npmjs.org/@eslint/core/-/core-0.15.1.tgz", + "integrity": "sha512-bkOp+iumZCCbt1K1CmWf0R9pM5yKpDv+ZXtvSyQpudrI9kuFLp+bM2WOPXImuD/ceQuaa8f5pj93Y7zyECIGNA==", + "dev": true, + "license": "Apache-2.0", + "dependencies": { + "@types/json-schema": "^7.0.15" + }, + "engines": { + "node": "^18.18.0 || ^20.9.0 || >=21.1.0" + } + }, + "node_modules/@eslint/eslintrc": { + "version": "3.3.1", + "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-3.3.1.tgz", + "integrity": "sha512-gtF186CXhIl1p4pJNGZw8Yc6RlshoePRvE0X91oPGb3vZ8pM3qOS9W9NGPat9LziaBV7XrJWGylNQXkGcnM3IQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "ajv": "^6.12.4", + "debug": "^4.3.2", + "espree": "^10.0.1", + "globals": "^14.0.0", + "ignore": "^5.2.0", + "import-fresh": "^3.2.1", + "js-yaml": "^4.1.0", + "minimatch": "^3.1.2", + "strip-json-comments": "^3.1.1" + }, + "engines": { + "node": "^18.18.0 || ^20.9.0 || >=21.1.0" + }, + "funding": { + "url": "https://opencollective.com/eslint" + } + }, + "node_modules/@eslint/js": { + "version": "9.31.0", + "resolved": "https://registry.npmjs.org/@eslint/js/-/js-9.31.0.tgz", + "integrity": "sha512-LOm5OVt7D4qiKCqoiPbA7LWmI+tbw1VbTUowBcUMgQSuM6poJufkFkYDcQpo5KfgD39TnNySV26QjOh7VFpSyw==", + "dev": true, + "license": "MIT", + "engines": { + "node": "^18.18.0 || ^20.9.0 || >=21.1.0" + }, + "funding": { + "url": "https://eslint.org/donate" + } + }, + "node_modules/@eslint/object-schema": { + "version": "2.1.6", + "resolved": "https://registry.npmjs.org/@eslint/object-schema/-/object-schema-2.1.6.tgz", + "integrity": "sha512-RBMg5FRL0I0gs51M/guSAj5/e14VQ4tpZnQNWwuDT66P14I43ItmPfIZRhO9fUVIPOAQXU47atlywZ/czoqFPA==", + "dev": true, + "license": "Apache-2.0", + "engines": { + "node": "^18.18.0 || ^20.9.0 || >=21.1.0" + } + }, + "node_modules/@eslint/plugin-kit": { + "version": "0.3.3", + "resolved": "https://registry.npmjs.org/@eslint/plugin-kit/-/plugin-kit-0.3.3.tgz", + "integrity": "sha512-1+WqvgNMhmlAambTvT3KPtCl/Ibr68VldY2XY40SL1CE0ZXiakFR/cbTspaF5HsnpDMvcYYoJHfl4980NBjGag==", + "dev": true, + "license": "Apache-2.0", + "dependencies": { + "@eslint/core": "^0.15.1", + "levn": "^0.4.1" + }, + "engines": { + "node": "^18.18.0 || ^20.9.0 || >=21.1.0" + } + }, + "node_modules/@humanfs/core": { + "version": "0.19.1", + "resolved": "https://registry.npmjs.org/@humanfs/core/-/core-0.19.1.tgz", + "integrity": "sha512-5DyQ4+1JEUzejeK1JGICcideyfUbGixgS9jNgex5nqkW+cY7WZhxBigmieN5Qnw9ZosSNVC9KQKyb+GUaGyKUA==", + "dev": true, + "license": "Apache-2.0", + "engines": { + "node": ">=18.18.0" + } + }, + "node_modules/@humanfs/node": { + "version": "0.16.6", + "resolved": "https://registry.npmjs.org/@humanfs/node/-/node-0.16.6.tgz", + "integrity": "sha512-YuI2ZHQL78Q5HbhDiBA1X4LmYdXCKCMQIfw0pw7piHJwyREFebJUvrQN4cMssyES6x+vfUbx1CIpaQUKYdQZOw==", + "dev": true, + "license": "Apache-2.0", + "dependencies": { + "@humanfs/core": "^0.19.1", + "@humanwhocodes/retry": "^0.3.0" + }, + "engines": { + "node": ">=18.18.0" + } + }, + "node_modules/@humanfs/node/node_modules/@humanwhocodes/retry": { + "version": "0.3.1", + "resolved": "https://registry.npmjs.org/@humanwhocodes/retry/-/retry-0.3.1.tgz", + "integrity": "sha512-JBxkERygn7Bv/GbN5Rv8Ul6LVknS+5Bp6RgDC/O8gEBU/yeH5Ui5C/OlWrTb6qct7LjjfT6Re2NxB0ln0yYybA==", + "dev": true, + "license": "Apache-2.0", + "engines": { + "node": ">=18.18" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/nzakas" + } + }, + "node_modules/@humanwhocodes/module-importer": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/@humanwhocodes/module-importer/-/module-importer-1.0.1.tgz", + "integrity": "sha512-bxveV4V8v5Yb4ncFTT3rPSgZBOpCkjfK0y4oVVVJwIuDVBRMDXrPyXRL988i5ap9m9bnyEEjWfm5WkBmtffLfA==", + "dev": true, + "license": "Apache-2.0", + "engines": { + "node": ">=12.22" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/nzakas" + } + }, + "node_modules/@humanwhocodes/retry": { + "version": "0.4.3", + "resolved": "https://registry.npmjs.org/@humanwhocodes/retry/-/retry-0.4.3.tgz", + "integrity": "sha512-bV0Tgo9K4hfPCek+aMAn81RppFKv2ySDQeMoSZuvTASywNTnVJCArCZE2FWqpvIatKu7VMRLWlR1EazvVhDyhQ==", + "dev": true, + "license": "Apache-2.0", + "engines": { + "node": ">=18.18" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/nzakas" + } + }, + "node_modules/@types/estree": { + "version": "1.0.8", + "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.8.tgz", + "integrity": "sha512-dWHzHa2WqEXI/O1E9OjrocMTKJl2mSrEolh1Iomrv6U+JuNwaHXsXx9bLu5gG7BUWFIN0skIQJQ/L1rIex4X6w==", + "dev": true, + "license": "MIT" + }, + "node_modules/@types/json-schema": { + "version": "7.0.15", + "resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.15.tgz", + "integrity": "sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA==", + "dev": true, + "license": "MIT" + }, + "node_modules/acorn": { + "version": "8.15.0", + "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.15.0.tgz", + "integrity": "sha512-NZyJarBfL7nWwIq+FDL6Zp/yHEhePMNnnJ0y3qfieCrmNvYct8uvtiV41UvlSe6apAfk0fY1FbWx+NwfmpvtTg==", + "dev": true, + "license": "MIT", + "bin": { + "acorn": "bin/acorn" + }, + "engines": { + "node": ">=0.4.0" + } + }, + "node_modules/acorn-jsx": { + "version": "5.3.2", + "resolved": "https://registry.npmjs.org/acorn-jsx/-/acorn-jsx-5.3.2.tgz", + "integrity": "sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==", + "dev": true, + "license": "MIT", + "peerDependencies": { + "acorn": "^6.0.0 || ^7.0.0 || ^8.0.0" + } + }, + "node_modules/ajv": { + "version": "6.12.6", + "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz", + "integrity": "sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==", + "dev": true, + "license": "MIT", + "dependencies": { + "fast-deep-equal": "^3.1.1", + "fast-json-stable-stringify": "^2.0.0", + "json-schema-traverse": "^0.4.1", + "uri-js": "^4.2.2" + }, + "funding": { + "type": "github", + "url": "https://github.com/sponsors/epoberezkin" + } + }, + "node_modules/ansi-styles": { + "version": "4.3.0", + "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz", + "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==", + "dev": true, + "license": "MIT", + "dependencies": { + "color-convert": "^2.0.1" + }, + "engines": { + "node": ">=8" + }, + "funding": { + "url": "https://github.com/chalk/ansi-styles?sponsor=1" + } + }, + "node_modules/argparse": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz", + "integrity": "sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==", + "dev": true, + "license": "Python-2.0" + }, + "node_modules/balanced-match": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz", + "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==", + "dev": true, + "license": "MIT" + }, + "node_modules/brace-expansion": { + "version": "1.1.12", + "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.12.tgz", + "integrity": "sha512-9T9UjW3r0UW5c1Q7GTwllptXwhvYmEzFhzMfZ9H7FQWt+uZePjZPjBP/W1ZEyZ1twGWom5/56TF4lPcqjnDHcg==", + "dev": true, + "license": "MIT", + "dependencies": { + "balanced-match": "^1.0.0", + "concat-map": "0.0.1" + } + }, + "node_modules/callsites": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/callsites/-/callsites-3.1.0.tgz", + "integrity": "sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=6" + } + }, + "node_modules/chalk": { + "version": "4.1.2", + "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz", + "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==", + "dev": true, + "license": "MIT", + "dependencies": { + "ansi-styles": "^4.1.0", + "supports-color": "^7.1.0" + }, + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/chalk/chalk?sponsor=1" + } + }, + "node_modules/color-convert": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz", + "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "color-name": "~1.1.4" + }, + "engines": { + "node": ">=7.0.0" + } + }, + "node_modules/color-name": { + "version": "1.1.4", + "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz", + "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==", + "dev": true, + "license": "MIT" + }, + "node_modules/concat-map": { + "version": "0.0.1", + "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz", + "integrity": "sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==", + "dev": true, + "license": "MIT" + }, + "node_modules/cross-spawn": { + "version": "7.0.6", + "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.6.tgz", + "integrity": "sha512-uV2QOWP2nWzsy2aMp8aRibhi9dlzF5Hgh5SHaB9OiTGEyDTiJJyx0uy51QXdyWbtAHNua4XJzUKca3OzKUd3vA==", + "dev": true, + "license": "MIT", + "dependencies": { + "path-key": "^3.1.0", + "shebang-command": "^2.0.0", + "which": "^2.0.1" + }, + "engines": { + "node": ">= 8" + } + }, + "node_modules/debug": { + "version": "4.4.1", + "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.1.tgz", + "integrity": "sha512-KcKCqiftBJcZr++7ykoDIEwSa3XWowTfNPo92BYxjXiyYEVrUQh2aLyhxBCwww+heortUFxEJYcRzosstTEBYQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "ms": "^2.1.3" + }, + "engines": { + "node": ">=6.0" + }, + "peerDependenciesMeta": { + "supports-color": { + "optional": true + } + } + }, + "node_modules/deep-is": { + "version": "0.1.4", + "resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.4.tgz", + "integrity": "sha512-oIPzksmTg4/MriiaYGO+okXDT7ztn/w3Eptv/+gSIdMdKsJo0u4CfYNFJPy+4SKMuCqGw2wxnA+URMg3t8a/bQ==", + "dev": true, + "license": "MIT" + }, + "node_modules/escape-string-regexp": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz", + "integrity": "sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/eslint": { + "version": "9.31.0", + "resolved": "https://registry.npmjs.org/eslint/-/eslint-9.31.0.tgz", + "integrity": "sha512-QldCVh/ztyKJJZLr4jXNUByx3gR+TDYZCRXEktiZoUR3PGy4qCmSbkxcIle8GEwGpb5JBZazlaJ/CxLidXdEbQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "@eslint-community/eslint-utils": "^4.2.0", + "@eslint-community/regexpp": "^4.12.1", + "@eslint/config-array": "^0.21.0", + "@eslint/config-helpers": "^0.3.0", + "@eslint/core": "^0.15.0", + "@eslint/eslintrc": "^3.3.1", + "@eslint/js": "9.31.0", + "@eslint/plugin-kit": "^0.3.1", + "@humanfs/node": "^0.16.6", + "@humanwhocodes/module-importer": "^1.0.1", + "@humanwhocodes/retry": "^0.4.2", + "@types/estree": "^1.0.6", + "@types/json-schema": "^7.0.15", + "ajv": "^6.12.4", + "chalk": "^4.0.0", + "cross-spawn": "^7.0.6", + "debug": "^4.3.2", + "escape-string-regexp": "^4.0.0", + "eslint-scope": "^8.4.0", + "eslint-visitor-keys": "^4.2.1", + "espree": "^10.4.0", + "esquery": "^1.5.0", + "esutils": "^2.0.2", + "fast-deep-equal": "^3.1.3", + "file-entry-cache": "^8.0.0", + "find-up": "^5.0.0", + "glob-parent": "^6.0.2", + "ignore": "^5.2.0", + "imurmurhash": "^0.1.4", + "is-glob": "^4.0.0", + "json-stable-stringify-without-jsonify": "^1.0.1", + "lodash.merge": "^4.6.2", + "minimatch": "^3.1.2", + "natural-compare": "^1.4.0", + "optionator": "^0.9.3" + }, + "bin": { + "eslint": "bin/eslint.js" + }, + "engines": { + "node": "^18.18.0 || ^20.9.0 || >=21.1.0" + }, + "funding": { + "url": "https://eslint.org/donate" + }, + "peerDependencies": { + "jiti": "*" + }, + "peerDependenciesMeta": { + "jiti": { + "optional": true + } + } + }, + "node_modules/eslint-config-prettier": { + "version": "10.1.5", + "resolved": "https://registry.npmjs.org/eslint-config-prettier/-/eslint-config-prettier-10.1.5.tgz", + "integrity": "sha512-zc1UmCpNltmVY34vuLRV61r1K27sWuX39E+uyUnY8xS2Bex88VV9cugG+UZbRSRGtGyFboj+D8JODyme1plMpw==", + "dev": true, + "license": "MIT", + "bin": { + "eslint-config-prettier": "bin/cli.js" + }, + "funding": { + "url": "https://opencollective.com/eslint-config-prettier" + }, + "peerDependencies": { + "eslint": ">=7.0.0" + } + }, + "node_modules/eslint-scope": { + "version": "8.4.0", + "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-8.4.0.tgz", + "integrity": "sha512-sNXOfKCn74rt8RICKMvJS7XKV/Xk9kA7DyJr8mJik3S7Cwgy3qlkkmyS2uQB3jiJg6VNdZd/pDBJu0nvG2NlTg==", + "dev": true, + "license": "BSD-2-Clause", + "dependencies": { + "esrecurse": "^4.3.0", + "estraverse": "^5.2.0" + }, + "engines": { + "node": "^18.18.0 || ^20.9.0 || >=21.1.0" + }, + "funding": { + "url": "https://opencollective.com/eslint" + } + }, + "node_modules/eslint-visitor-keys": { + "version": "4.2.1", + "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-4.2.1.tgz", + "integrity": "sha512-Uhdk5sfqcee/9H/rCOJikYz67o0a2Tw2hGRPOG2Y1R2dg7brRe1uG0yaNQDHu+TO/uQPF/5eCapvYSmHUjt7JQ==", + "dev": true, + "license": "Apache-2.0", + "engines": { + "node": "^18.18.0 || ^20.9.0 || >=21.1.0" + }, + "funding": { + "url": "https://opencollective.com/eslint" + } + }, + "node_modules/espree": { + "version": "10.4.0", + "resolved": "https://registry.npmjs.org/espree/-/espree-10.4.0.tgz", + "integrity": "sha512-j6PAQ2uUr79PZhBjP5C5fhl8e39FmRnOjsD5lGnWrFU8i2G776tBK7+nP8KuQUTTyAZUwfQqXAgrVH5MbH9CYQ==", + "dev": true, + "license": "BSD-2-Clause", + "dependencies": { + "acorn": "^8.15.0", + "acorn-jsx": "^5.3.2", + "eslint-visitor-keys": "^4.2.1" + }, + "engines": { + "node": "^18.18.0 || ^20.9.0 || >=21.1.0" + }, + "funding": { + "url": "https://opencollective.com/eslint" + } + }, + "node_modules/esquery": { + "version": "1.6.0", + "resolved": "https://registry.npmjs.org/esquery/-/esquery-1.6.0.tgz", + "integrity": "sha512-ca9pw9fomFcKPvFLXhBKUK90ZvGibiGOvRJNbjljY7s7uq/5YO4BOzcYtJqExdx99rF6aAcnRxHmcUHcz6sQsg==", + "dev": true, + "license": "BSD-3-Clause", + "dependencies": { + "estraverse": "^5.1.0" + }, + "engines": { + "node": ">=0.10" + } + }, + "node_modules/esrecurse": { + "version": "4.3.0", + "resolved": "https://registry.npmjs.org/esrecurse/-/esrecurse-4.3.0.tgz", + "integrity": "sha512-KmfKL3b6G+RXvP8N1vr3Tq1kL/oCFgn2NYXEtqP8/L3pKapUA4G8cFVaoF3SU323CD4XypR/ffioHmkti6/Tag==", + "dev": true, + "license": "BSD-2-Clause", + "dependencies": { + "estraverse": "^5.2.0" + }, + "engines": { + "node": ">=4.0" + } + }, + "node_modules/estraverse": { + "version": "5.3.0", + "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-5.3.0.tgz", + "integrity": "sha512-MMdARuVEQziNTeJD8DgMqmhwR11BRQ/cBP+pLtYdSTnf3MIO8fFeiINEbX36ZdNlfU/7A9f3gUw49B3oQsvwBA==", + "dev": true, + "license": "BSD-2-Clause", + "engines": { + "node": ">=4.0" + } + }, + "node_modules/esutils": { + "version": "2.0.3", + "resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.3.tgz", + "integrity": "sha512-kVscqXk4OCp68SZ0dkgEKVi6/8ij300KBWTJq32P/dYeWTSwK41WyTxalN1eRmA5Z9UU/LX9D7FWSmV9SAYx6g==", + "dev": true, + "license": "BSD-2-Clause", + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/fast-deep-equal": { + "version": "3.1.3", + "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz", + "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==", + "dev": true, + "license": "MIT" + }, + "node_modules/fast-json-stable-stringify": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz", + "integrity": "sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw==", + "dev": true, + "license": "MIT" + }, + "node_modules/fast-levenshtein": { + "version": "2.0.6", + "resolved": "https://registry.npmjs.org/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz", + "integrity": "sha512-DCXu6Ifhqcks7TZKY3Hxp3y6qphY5SJZmrWMDrKcERSOXWQdMhU9Ig/PYrzyw/ul9jOIyh0N4M0tbC5hodg8dw==", + "dev": true, + "license": "MIT" + }, + "node_modules/file-entry-cache": { + "version": "8.0.0", + "resolved": "https://registry.npmjs.org/file-entry-cache/-/file-entry-cache-8.0.0.tgz", + "integrity": "sha512-XXTUwCvisa5oacNGRP9SfNtYBNAMi+RPwBFmblZEF7N7swHYQS6/Zfk7SRwx4D5j3CH211YNRco1DEMNVfZCnQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "flat-cache": "^4.0.0" + }, + "engines": { + "node": ">=16.0.0" + } + }, + "node_modules/find-up": { + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/find-up/-/find-up-5.0.0.tgz", + "integrity": "sha512-78/PXT1wlLLDgTzDs7sjq9hzz0vXD+zn+7wypEe4fXQxCmdmqfGsEPQxmiCSQI3ajFV91bVSsvNtrJRiW6nGng==", + "dev": true, + "license": "MIT", + "dependencies": { + "locate-path": "^6.0.0", + "path-exists": "^4.0.0" + }, + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/flat-cache": { + "version": "4.0.1", + "resolved": "https://registry.npmjs.org/flat-cache/-/flat-cache-4.0.1.tgz", + "integrity": "sha512-f7ccFPK3SXFHpx15UIGyRJ/FJQctuKZ0zVuN3frBo4HnK3cay9VEW0R6yPYFHC0AgqhukPzKjq22t5DmAyqGyw==", + "dev": true, + "license": "MIT", + "dependencies": { + "flatted": "^3.2.9", + "keyv": "^4.5.4" + }, + "engines": { + "node": ">=16" + } + }, + "node_modules/flatted": { + "version": "3.3.3", + "resolved": "https://registry.npmjs.org/flatted/-/flatted-3.3.3.tgz", + "integrity": "sha512-GX+ysw4PBCz0PzosHDepZGANEuFCMLrnRTiEy9McGjmkCQYwRq4A/X786G/fjM/+OjsWSU1ZrY5qyARZmO/uwg==", + "dev": true, + "license": "ISC" + }, + "node_modules/glob-parent": { + "version": "6.0.2", + "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-6.0.2.tgz", + "integrity": "sha512-XxwI8EOhVQgWp6iDL+3b0r86f4d6AX6zSU55HfB4ydCEuXLXc5FcYeOu+nnGftS4TEju/11rt4KJPTMgbfmv4A==", + "dev": true, + "license": "ISC", + "dependencies": { + "is-glob": "^4.0.3" + }, + "engines": { + "node": ">=10.13.0" + } + }, + "node_modules/globals": { + "version": "14.0.0", + "resolved": "https://registry.npmjs.org/globals/-/globals-14.0.0.tgz", + "integrity": "sha512-oahGvuMGQlPw/ivIYBjVSrWAfWLBeku5tpPE2fOPLi+WHffIWbuh2tCjhyQhTBPMf5E9jDEH4FOmTYgYwbKwtQ==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=18" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/has-flag": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz", + "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=8" + } + }, + "node_modules/ignore": { + "version": "5.3.2", + "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.2.tgz", + "integrity": "sha512-hsBTNUqQTDwkWtcdYI2i06Y/nUBEsNEDJKjWdigLvegy8kDuJAS8uRlpkkcQpyEXL0Z/pjDy5HBmMjRCJ2gq+g==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">= 4" + } + }, + "node_modules/import-fresh": { + "version": "3.3.1", + "resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.1.tgz", + "integrity": "sha512-TR3KfrTZTYLPB6jUjfx6MF9WcWrHL9su5TObK4ZkYgBdWKPOFoSoQIdEuTuR82pmtxH2spWG9h6etwfr1pLBqQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "parent-module": "^1.0.0", + "resolve-from": "^4.0.0" + }, + "engines": { + "node": ">=6" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/imurmurhash": { + "version": "0.1.4", + "resolved": "https://registry.npmjs.org/imurmurhash/-/imurmurhash-0.1.4.tgz", + "integrity": "sha512-JmXMZ6wuvDmLiHEml9ykzqO6lwFbof0GG4IkcGaENdCRDDmMVnny7s5HsIgHCbaq0w2MyPhDqkhTUgS2LU2PHA==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=0.8.19" + } + }, + "node_modules/is-extglob": { + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz", + "integrity": "sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/is-glob": { + "version": "4.0.3", + "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz", + "integrity": "sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==", + "dev": true, + "license": "MIT", + "dependencies": { + "is-extglob": "^2.1.1" + }, + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/isexe": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz", + "integrity": "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==", + "dev": true, + "license": "ISC" + }, + "node_modules/js-yaml": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-4.1.0.tgz", + "integrity": "sha512-wpxZs9NoxZaJESJGIZTyDEaYpl0FKSA+FB9aJiyemKhMwkxQg63h4T1KJgUGHpTqPDNRcmmYLugrRjJlBtWvRA==", + "dev": true, + "license": "MIT", + "dependencies": { + "argparse": "^2.0.1" + }, + "bin": { + "js-yaml": "bin/js-yaml.js" + } + }, + "node_modules/json-buffer": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/json-buffer/-/json-buffer-3.0.1.tgz", + "integrity": "sha512-4bV5BfR2mqfQTJm+V5tPPdf+ZpuhiIvTuAB5g8kcrXOZpTT/QwwVRWBywX1ozr6lEuPdbHxwaJlm9G6mI2sfSQ==", + "dev": true, + "license": "MIT" + }, + "node_modules/json-schema-traverse": { + "version": "0.4.1", + "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz", + "integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==", + "dev": true, + "license": "MIT" + }, + "node_modules/json-stable-stringify-without-jsonify": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/json-stable-stringify-without-jsonify/-/json-stable-stringify-without-jsonify-1.0.1.tgz", + "integrity": "sha512-Bdboy+l7tA3OGW6FjyFHWkP5LuByj1Tk33Ljyq0axyzdk9//JSi2u3fP1QSmd1KNwq6VOKYGlAu87CisVir6Pw==", + "dev": true, + "license": "MIT" + }, + "node_modules/keyv": { + "version": "4.5.4", + "resolved": "https://registry.npmjs.org/keyv/-/keyv-4.5.4.tgz", + "integrity": "sha512-oxVHkHR/EJf2CNXnWxRLW6mg7JyCCUcG0DtEGmL2ctUo1PNTin1PUil+r/+4r5MpVgC/fn1kjsx7mjSujKqIpw==", + "dev": true, + "license": "MIT", + "dependencies": { + "json-buffer": "3.0.1" + } + }, + "node_modules/levn": { + "version": "0.4.1", + "resolved": "https://registry.npmjs.org/levn/-/levn-0.4.1.tgz", + "integrity": "sha512-+bT2uH4E5LGE7h/n3evcS/sQlJXCpIp6ym8OWJ5eV6+67Dsql/LaaT7qJBAt2rzfoa/5QBGBhxDix1dMt2kQKQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "prelude-ls": "^1.2.1", + "type-check": "~0.4.0" + }, + "engines": { + "node": ">= 0.8.0" + } + }, + "node_modules/locate-path": { + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-6.0.0.tgz", + "integrity": "sha512-iPZK6eYjbxRu3uB4/WZ3EsEIMJFMqAoopl3R+zuq0UjcAm/MO6KCweDgPfP3elTztoKP3KtnVHxTn2NHBSDVUw==", + "dev": true, + "license": "MIT", + "dependencies": { + "p-locate": "^5.0.0" + }, + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/lodash.merge": { + "version": "4.6.2", + "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.2.tgz", + "integrity": "sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==", + "dev": true, + "license": "MIT" + }, + "node_modules/minimatch": { + "version": "3.1.2", + "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz", + "integrity": "sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==", + "dev": true, + "license": "ISC", + "dependencies": { + "brace-expansion": "^1.1.7" + }, + "engines": { + "node": "*" + } + }, + "node_modules/ms": { + "version": "2.1.3", + "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz", + "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==", + "dev": true, + "license": "MIT" + }, + "node_modules/natural-compare": { + "version": "1.4.0", + "resolved": "https://registry.npmjs.org/natural-compare/-/natural-compare-1.4.0.tgz", + "integrity": "sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==", + "dev": true, + "license": "MIT" + }, + "node_modules/optionator": { + "version": "0.9.4", + "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.9.4.tgz", + "integrity": "sha512-6IpQ7mKUxRcZNLIObR0hz7lxsapSSIYNZJwXPGeF0mTVqGKFIXj1DQcMoT22S3ROcLyY/rz0PWaWZ9ayWmad9g==", + "dev": true, + "license": "MIT", + "dependencies": { + "deep-is": "^0.1.3", + "fast-levenshtein": "^2.0.6", + "levn": "^0.4.1", + "prelude-ls": "^1.2.1", + "type-check": "^0.4.0", + "word-wrap": "^1.2.5" + }, + "engines": { + "node": ">= 0.8.0" + } + }, + "node_modules/p-limit": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-3.1.0.tgz", + "integrity": "sha512-TYOanM3wGwNGsZN2cVTYPArw454xnXj5qmWF1bEoAc4+cU/ol7GVh7odevjp1FNHduHc3KZMcFduxU5Xc6uJRQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "yocto-queue": "^0.1.0" + }, + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/p-locate": { + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-5.0.0.tgz", + "integrity": "sha512-LaNjtRWUBY++zB5nE/NwcaoMylSPk+S+ZHNB1TzdbMJMny6dynpAGt7X/tl/QYq3TIeE6nxHppbo2LGymrG5Pw==", + "dev": true, + "license": "MIT", + "dependencies": { + "p-limit": "^3.0.2" + }, + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/parent-module": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/parent-module/-/parent-module-1.0.1.tgz", + "integrity": "sha512-GQ2EWRpQV8/o+Aw8YqtfZZPfNRWZYkbidE9k5rpl/hC3vtHHBfGm2Ifi6qWV+coDGkrUKZAxE3Lot5kcsRlh+g==", + "dev": true, + "license": "MIT", + "dependencies": { + "callsites": "^3.0.0" + }, + "engines": { + "node": ">=6" + } + }, + "node_modules/path-exists": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz", + "integrity": "sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=8" + } + }, + "node_modules/path-key": { + "version": "3.1.1", + "resolved": "https://registry.npmjs.org/path-key/-/path-key-3.1.1.tgz", + "integrity": "sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=8" + } + }, + "node_modules/prelude-ls": { + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.2.1.tgz", + "integrity": "sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">= 0.8.0" + } + }, + "node_modules/prettier": { + "version": "3.6.2", + "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.6.2.tgz", + "integrity": "sha512-I7AIg5boAr5R0FFtJ6rCfD+LFsWHp81dolrFD8S79U9tb8Az2nGrJncnMSnys+bpQJfRUzqs9hnA81OAA3hCuQ==", + "dev": true, + "license": "MIT", + "bin": { + "prettier": "bin/prettier.cjs" + }, + "engines": { + "node": ">=14" + }, + "funding": { + "url": "https://github.com/prettier/prettier?sponsor=1" + } + }, + "node_modules/punycode": { + "version": "2.3.1", + "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.1.tgz", + "integrity": "sha512-vYt7UD1U9Wg6138shLtLOvdAu+8DsC/ilFtEVHcH+wydcSpNE20AfSOduf6MkRFahL5FY7X1oU7nKVZFtfq8Fg==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=6" + } + }, + "node_modules/resolve-from": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-4.0.0.tgz", + "integrity": "sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=4" + } + }, + "node_modules/shebang-command": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz", + "integrity": "sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA==", + "dev": true, + "license": "MIT", + "dependencies": { + "shebang-regex": "^3.0.0" + }, + "engines": { + "node": ">=8" + } + }, + "node_modules/shebang-regex": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/shebang-regex/-/shebang-regex-3.0.0.tgz", + "integrity": "sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=8" + } + }, + "node_modules/strip-json-comments": { + "version": "3.1.1", + "resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-3.1.1.tgz", + "integrity": "sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=8" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, + "node_modules/supports-color": { + "version": "7.2.0", + "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz", + "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==", + "dev": true, + "license": "MIT", + "dependencies": { + "has-flag": "^4.0.0" + }, + "engines": { + "node": ">=8" + } + }, + "node_modules/type-check": { + "version": "0.4.0", + "resolved": "https://registry.npmjs.org/type-check/-/type-check-0.4.0.tgz", + "integrity": "sha512-XleUoc9uwGXqjWwXaUTZAmzMcFZ5858QA2vvx1Ur5xIcixXIP+8LnFDgRplU30us6teqdlskFfu+ae4K79Ooew==", + "dev": true, + "license": "MIT", + "dependencies": { + "prelude-ls": "^1.2.1" + }, + "engines": { + "node": ">= 0.8.0" + } + }, + "node_modules/uri-js": { + "version": "4.4.1", + "resolved": "https://registry.npmjs.org/uri-js/-/uri-js-4.4.1.tgz", + "integrity": "sha512-7rKUyy33Q1yc98pQ1DAmLtwX109F7TIfWlW1Ydo8Wl1ii1SeHieeh0HHfPeL2fMXK6z0s8ecKs9frCuLJvndBg==", + "dev": true, + "license": "BSD-2-Clause", + "dependencies": { + "punycode": "^2.1.0" + } + }, + "node_modules/which": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz", + "integrity": "sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==", + "dev": true, + "license": "ISC", + "dependencies": { + "isexe": "^2.0.0" + }, + "bin": { + "node-which": "bin/node-which" + }, + "engines": { + "node": ">= 8" + } + }, + "node_modules/word-wrap": { + "version": "1.2.5", + "resolved": "https://registry.npmjs.org/word-wrap/-/word-wrap-1.2.5.tgz", + "integrity": "sha512-BN22B5eaMMI9UMtjrGd5g5eCYPpCPDUy0FJXbYsaT5zYxjFOckS53SQDE3pWkVoWpHXVb3BrYcEN4Twa55B5cA==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/yocto-queue": { + "version": "0.1.0", + "resolved": "https://registry.npmjs.org/yocto-queue/-/yocto-queue-0.1.0.tgz", + "integrity": "sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=10" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + } + } +} diff --git a/package.json b/package.json new file mode 100644 index 0000000000..6d847643a8 --- /dev/null +++ b/package.json @@ -0,0 +1,13 @@ +{ + "name": "comments-project", + "version": "1.0.0", + "description": "Project for comments app", + "main": "main.js", + "scripts": { + "lint": "eslint .", + "format": "prettier --write \"**/*.{js,html,css}\""}, + "devDependencies": { + "eslint": "^9.31.0", + "eslint-config-prettier": "^10.1.5", + "prettier": "^3.6.2"} +} \ No newline at end of file diff --git a/renderComments.js b/renderComments.js new file mode 100644 index 0000000000..8ca292480c --- /dev/null +++ b/renderComments.js @@ -0,0 +1,89 @@ +import { escapeHTML } from './escapeHTML.js'; +import { getToken } from './api.js'; + +const formatDate = (timestamp) => { + const date = new Date(timestamp); + return date.toLocaleString('ru-RU', { + day: '2-digit', + month: '2-digit', + year: 'numeric', + hour: '2-digit', + minute: '2-digit' + }); +}; + +export function renderComments(comments, isLoading = false, error = null, formData = { text: '' }, commentsList) { + const token = getToken(); + + if (!commentsList) { + commentsList = document.querySelector('.comments'); + if (!commentsList) return; + } + + commentsList.innerHTML = ''; + + if (isLoading) { + commentsList.innerHTML = '
Загрузка...
'; + return; + } + + if (error) { + commentsList.innerHTML = ` +
+ Ошибка: ${error.message} + +
+ `; + return; + } + + if (!comments || comments.length === 0) { + commentsList.innerHTML = '
Комментариев пока нет
'; + return; + } + + comments.forEach(comment => { + const commentElement = document.createElement('li'); + commentElement.className = 'comment'; + commentElement.dataset.id = comment.id; + + const safeName = escapeHTML(comment.name); + const safeText = escapeHTML(comment.text); + const date = formatDate(comment.date); + + let likeButtonClass = 'like-button'; + if (comment.isLiked) likeButtonClass += ' -active-like'; + if (comment.isLikeLoading) likeButtonClass += ' -loading-like'; + + commentElement.innerHTML = ` +
+
${safeName}
+
${date}
+
+
${safeText}
+ + ${comment.isSending ? '
Отправка...
' : ''} + `; + + commentsList.appendChild(commentElement); + }); + + if (!token) { + const container = document.querySelector('.container'); + if (container && !document.querySelector('.auth-prompt')) { + container.insertAdjacentHTML('beforeend', ` +
+ Чтобы добавить комментарий, авторизуйтесь +
+ `); + } + } +} \ No newline at end of file diff --git a/styles.css b/styles.css index edc120f8cd..c547f7d7b4 100644 --- a/styles.css +++ b/styles.css @@ -1,137 +1,407 @@ -body { - margin: 0; - } +html, body { + overflow-x: hidden; + margin: 0; +} - .container { - font-family: Helvetica; - color: #ffffff; - display: flex; - flex-direction: column; - align-items: center; - padding-top: 80px; - padding-bottom: 200px; - background: #202020; - min-height: 100vh; - } +.container { + font-family: Helvetica; + color: #ffffff; + display: flex; + flex-direction: column; + align-items: center; + padding-top: 80px; + padding-bottom: 200px; + background: #202020; + min-height: 100vh; + justify-content: flex-start; +} - .comments, - .comment { - margin: 0; - padding: 0; - list-style: none; - } +body.-noscroll { + overflow: hidden; +} - .comment, - .add-form { - width: 596px; - box-sizing: border-box; - background: radial-gradient( - 75.42% 75.42% at 50% 42.37%, - rgba(53, 53, 53, 0) 22.92%, - #7334ea 100% - ); - filter: drop-shadow(0px 20px 67px rgba(0, 0, 0, 0.08)); - border-radius: 20px; - } +.comments, +.comment { + margin: 0; + padding: 0; + list-style: none; +} - .comments { - display: flex; - flex-direction: column; - gap: 24px; - } +.comment, +.add-form { + width: 596px; + box-sizing: border-box; + background: radial-gradient( + 75.42% 75.42% at 50% 42.37%, + rgba(53, 53, 53, 0) 22.92%, + #7334ea 100% + ); + filter: drop-shadow(0px 20px 67px rgba(0, 0, 0, 0.08)); + border-radius: 20px; +} - .comment { - padding: 48px; - } +.comments { + display: flex; + flex-direction: column; + gap: 24px; +} - .comment-header { - font-size: 16px; - display: flex; - justify-content: space-between; - } +.comment { + padding: 48px; +} - .comment-footer { - display: flex; - justify-content: flex-end; - } +.comment-header { + font-size: 16px; + display: flex; + justify-content: space-between; +} - .comment-body { - margin-top: 32px; - margin-bottom: 32px; - } +.comment-footer { + display: flex; + justify-content: space-between; + align-items: center; + margin-top: 15px; +} - .comment-text { - font-size: 32px; - } +.comment-reply { + background: none; + border: none; + color: #bcec30; + cursor: pointer; + font-size: 14px; + margin-right: 15px; + padding: 5px 10px; + border-radius: 5px; + transition: all 0.3s; +} - .likes { - display: flex; - align-items: center; - } +.comment-reply:hover { + background: rgba(188, 236, 48, 0.1); +} - .like-button { - all: unset; - cursor: pointer; - } +.comment-body { + margin-top: 32px; + margin-bottom: 32px; +} - .likes-counter { - font-size: 26px; - margin-right: 8px; - } +.comment-text { + font-size: 32px; +} - .like-button { - margin-left: 10px; - background-image: url("data:image/svg+xml,%3Csvg width='22' height='20' viewBox='0 0 22 20' fill='none' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath d='M11.11 16.9482L11 17.0572L10.879 16.9482C5.654 12.2507 2.2 9.14441 2.2 5.99455C2.2 3.81471 3.85 2.17984 6.05 2.17984C7.744 2.17984 9.394 3.26975 9.977 4.75204H12.023C12.606 3.26975 14.256 2.17984 15.95 2.17984C18.15 2.17984 19.8 3.81471 19.8 5.99455C19.8 9.14441 16.346 12.2507 11.11 16.9482ZM15.95 0C14.036 0 12.199 0.882834 11 2.26703C9.801 0.882834 7.964 0 6.05 0C2.662 0 0 2.6267 0 5.99455C0 10.1035 3.74 13.4714 9.405 18.5613L11 20L12.595 18.5613C18.26 13.4714 22 10.1035 22 5.99455C22 2.6267 19.338 0 15.95 0Z' fill='%23BCEC30' /%3E%3C/svg%3E"); - background-repeat: no-repeat; - width: 22px; - height: 22px; - } +.likes { + display: flex; + align-items: center; +} - .-active-like { - background-image: url("data:image/svg+xml,%3Csvg width='22' height='20' viewBox='0 0 22 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15.95 0C14.036 0 12.199 0.882834 11 2.26703C9.801 0.882834 7.964 0 6.05 0C2.662 0 0 2.6267 0 5.99455C0 10.1035 3.74 13.4714 9.405 18.5613L11 20L12.595 18.5613C18.26 13.4714 22 10.1035 22 5.99455C22 2.6267 19.338 0 15.95 0Z' fill='%23BCEC30'/%3E%3C/svg%3E"); - } +.like-button { + all: unset; + cursor: pointer; +} - .add-form { - padding: 20px; - margin-top: 48px; - display: flex; - flex-direction: column; - } +.likes-counter { + font-size: 26px; + margin-right: 8px; +} - .add-form-name, - .add-form-text { - font-size: 16px; - font-family: Helvetica; - border-radius: 8px; - border: none; - } +.like-button { + margin-left: 10px; + background-image: url("data:image/svg+xml,%3Csvg width='22' height='20' viewBox='0 0 22 20' fill='none' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath d='M11 20L9.405 18.5613C3.74 13.4714 0 10.1035 0 5.99455C0 2.6267 2.662 0 6.05 0C7.964 0 9.801 0.882834 11 2.26703C12.199 0.882834 14.036 0 15.95 0C19.338 0 22 2.6267 22 5.99455C22 10.1035 18.26 13.4714 12.595 18.5613L11 20Z' fill='%23BCEC30' fill-opacity='0.5'/%3E%3C/svg%3E"); + background-repeat: no-repeat; + width: 22px; + height: 22px; +} - .add-form-name { - width: 300px; - padding: 11px 22px; - } +.-active-like { + background-image: url("data:image/svg+xml,%3Csvg width='22' height='20' viewBox='0 0 22 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11 20L9.405 18.5613C3.74 13.4714 0 10.1035 0 5.99455C0 2.6267 2.662 0 6.05 0C7.964 0 9.801 0.882834 11 2.26703C12.199 0.882834 14.036 0 15.95 0C19.338 0 22 2.6267 22 5.99455C22 10.1035 18.26 13.4714 12.595 18.5613L11 20Z' fill='%23BCEC30'/%3E%3C/svg%3E"); +} - .add-form-text { - margin-top: 12px; - padding: 22px; - resize: none; - } +.add-form { + padding: 20px; + margin-top: 48px; + display: flex; + flex-direction: column; +} - .add-form-row { - display: flex; - justify-content: flex-end; - } +.add-form-name, +.add-form-text { + font-size: 16px; + font-family: Helvetica; + border-radius: 8px; + border: none; +} + +.add-form-name { + width: 300px; + padding: 11px 22px; + margin: 10px; +} + +.add-form-text { + margin-top: 12px; + padding: 22px; + resize: none; +} + +.add-form-row { + display: flex; + justify-content: flex-end; +} + +.add-form-button { + margin-top: 24px; + font-size: 24px; + padding: 10px 20px; + background-color: #bcec30; + border: none; + border-radius: 18px; + cursor: pointer; +} + +.add-form-button:hover { + opacity: 0.9; +} + +.reply-text { + color: #bcec30; + font-size: 14px; + margin: 8px 0; + padding-left: 10px; + border-left: 2px solid #bcec30; +} + +.empty-state { + color: #aaa; + padding: 30px; + text-align: center; + font-size: 18px; + background: rgba(255, 255, 255, 0.05); + border-radius: 10px; +} + +.error { + background: rgba(255, 0, 0, 0.1); + padding: 15px; + border-radius: 8px; + margin: 10px 0; + color: #ff6b6b; + text-align: center; +} - .add-form-button { - margin-top: 24px; - font-size: 24px; - padding: 10px 20px; - background-color: #bcec30; - border: none; - border-radius: 18px; - cursor: pointer; +.error button { + background: #ff6b6b; + color: white; + border: none; + padding: 5px 10px; + border-radius: 4px; + margin-top: 10px; + cursor: pointer; +} + +.empty { + text-align: center; + padding: 20px; + color: #aaa; + font-style: italic; +} + +.comment { + transition: all 0.3s ease; +} + +.comment:hover { + transform: translateY(-2px); + box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1); +} + +@keyframes rotating { + from { transform: rotate(0deg); } + 25% { transform: rotate(30deg); } + 75% { transform: rotate(-30deg); } + to { transform: rotate(0deg); } +} + +.-loading-like { + animation: rotating 1s linear infinite; +} + +.sending-indicator { + color: #bcec30; + font-size: 14px; + margin-top: 10px; + text-align: center; +} + +.comment-header { + display: flex; + justify-content: space-between; + align-items: center; +} + +.likes { + display: flex; + align-items: center; + gap: 5px; +} + +.loading { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + color: #bcec30; + font-size: 18px; + padding: 20px; +} + +.loading::before { + content: ""; + display: block; + width: 30px; + height: 30px; + border: 3px solid rgba(188, 236, 48, 0.3); + border-radius: 50%; + border-top-color: #bcec30; + animation: spin 1s ease-in-out infinite; + margin-bottom: 8px; +} + +@keyframes spin { + to { transform: rotate(360deg); } +} + +.add-form { + position: relative; + transition: all 0.3s ease; +} + +.add-form-overlay { + position: fixed; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: rgba(15, 15, 15, 0.92); + backdrop-filter: blur(8px); + border-radius: 20px; + z-index: 999; + display: flex; + align-items: center; + justify-content: center; + opacity: 0; + visibility: hidden; + transition: opacity 0.8s ease-out, visibility 0.8s ease-out; +} + +.add-form.-loading .add-form-overlay { + opacity: 1; + visibility: visible; + transition-delay: 0.1s; +} + +.add-form-loading { + position: fixed; + z-index: 1000; + background: rgba(35, 35, 35, 0.95); + color: #bcec30; + font-size: 24px; + font-weight: bold; + padding: 25px 40px; + border-radius: 20px; + box-shadow: 0 15px 35px rgba(0, 0, 0, 0.4); + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + gap: 20px; + text-align: center; + max-width: 80%; + width: auto; + animation: fadeInScale 0.8s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards; + opacity: 0; + transform: translate(-50%, -50%) scale(0.9); + border: 1px solid #bcec30; +} + +.add-form-loading::before { + content: ""; + display: block; + width: 35px; + height: 35px; + border: 3px solid rgba(188, 236, 48, 0.3); + border-radius: 50%; + border-top-color: #bcec30; + animation: spin 1.5s ease-in-out infinite; +} + +@keyframes pulse { + 0%, 100% { transform: scale(1); } + 50% { transform: scale(1.1); } +} + +.loading::before { + width: 25px; + height: 25px; + border-width: 3px; + margin-bottom: 5px; +} + +.loading { + font-size: 14px; +} + +@keyframes fadeInScale { + 0% { + opacity: 0; + transform: scale(0.95); + } + 100% { + opacity: 1; + transform: scale(1); } +} + +.auth-prompt { + text-align: center; + margin-top: 20px; + color: #aaa; + font-size: 16px; +} + +.auth-prompt a { + color: #bcec30; + text-decoration: none; +} + +.auth-prompt a:hover { + text-decoration: underline; +} + +.logout-button { + background: none; + border: 1px solid #bcec30; + color: #bcec30; + padding: 10px 20px; + border-radius: 18px; + cursor: pointer; + margin-left: 10px; + margin-top: 10px; +} + +.logout-button:hover { + background: rgba(188, 236, 48, 0.1); +} + +.add-form-button:disabled { + opacity: 0.7; + cursor: not-allowed; +} + +.add-form-name:disabled { + opacity: 0.7; + cursor: not-allowed; +} - .add-form-button:hover { - opacity: 0.9; - } \ No newline at end of file +#toggle-link[style*="pointer-events: none"] { + opacity: 0.5; + cursor: not-allowed; +} \ No newline at end of file