Алексей Уколов

Вы когда этот сайт куда-то выложите, откуда у людей будет браться диск D с вашими картинками?
В HTML указывается путь к изображению относительно веб-сервера, и этот сервер и должен их отдавать клиентам.

Не нужно сохранять результат items.filter() в state, туда нужно класть только поисковую фразу, а фильтровать просто при рендере налету перед .map().

Примерно так:

{navLinks.map((link) => (
    <Icon href={link.href} key={link.svgIcon} title={link.svgIcon} className={isCurrent ? `active` : undefined} />
))}

...
import classNames, { type Argument } from "classnames";

type Props = {
    title: string;
    href: string;
    className: Argument;
}

<Link href={props.href} className={classNames('svgh m-auto', props.className)>
    <SvgMail width="30" height="30" viewBox="0 0 50 50" />
</Link>

https://www.npmjs.com/package/classnames

let makeItDouble = (text) => {
  let i = text + text;
  return i;
};

console.log(makeItDouble("I never look back"));

Return всё прекрасно возвращает. Но то, что он возвращает, нужно сохранять в переменную или использовать сразу. Переменная i находится внутри функции и снаружи недоступна. Если бы можно было делать так, как вы написали, то и смысла в return бы не было.

А как вы код написали, если не можете понять, как он работает?

Вы открывали документацию функции, читали, что она делает и какие аргументы принимает?
Ну, давайте я вам её сюда скопирую:

Parameters
indexStart
The index of the first character to include in the returned substring.
indexEnd Optional
The index of the first character to exclude from the returned substring.
Description
If indexStart < 0, the index is counted from the end of the string. More formally, in this case, the substring starts at max(indexStart + str.length, 0).
If indexEnd < 0, the index is counted from the end of the string. More formally, in this case, the substring ends at max(indexEnd + str.length, 0).

зачем нужен (-2, -1)

Для выполнения вот этого условия задачи: "если слово заканчивается на мягкий знак, то получите предпоследнюю букву". Я искренне не понимаю, что тут можно добавить...

Подскажите, пожалуйста, есть ли способы быстро создать каталог из 120 страниц?

Для этого PHP и нужен. Но дьявол кроется в деталях. Как минимум, стоит отказаться от HTML в пользу СУБД+PHP.

У меня есть каталог клейм в pdf

В теории, PDF можно прочитать и взять данные напрямую. Но дьявол кроется в деталях. Зависит от того, какой у этого файла формат и внутренности.

Возможно ли, используя инструменты парсинга, быстро скопировать такой же себе?

Возможно. Но дьявол кроется в деталях. Есть сайты, которые противятся парсингу, есть сайты, которые тупо не выдерживают большое количество одновременных запросов, есть сайты, которые собираются через JavaScript на клиенте.

Насколько безопасно пользоваться такими инструментами при разработке софта?

На 42.

Какие меры предосторожности есть?

Шапочка из фольги.

Анализируют ли подобные инструменты код проекта

А зачем бы они тогда были нужны, если бы не анализировали? При этом какие-то могут и не анализировать для упрощения собственной жизни или из-за внешних ограничений. Сейчас столько их развелось, что наверняка сказать нельзя. Про каждый инструмент написано на его сайте.

могут ли "стянуть" креды которые описаны в local.env к примеру

Могут. Но заниматься этим специально никто не будет из крупных специализированных компаний. Вдобавок, в local.env у вас и не должно быть каких-то реальных продовых токенов.

Ну и в общем интересуют мысли комрадов на тему кодогенерации.

Камрад пишется через "а".
AI-ассистентов нужно выдавать только опытным разработчикам, потому что они не пишут код, а уменьшают рутину. Их нельзя использовать, если вы не можете написать то же самое самостоятельно - помимо галлюцинаций там могут быть просто ошибки и разработчик должен быть способен распознать и то, и другое.
Судя по ответам тех, кто решает нафармить себе зачем-то рейтинга здесь, перезадавая вопросы ChatGPT, а так же по вопросам тех, кто не поленился, прежде чем придти сюда, сходить в тот же ChatGPT - это редкий навык.

- img: {img1},
+ img: img1,

Запись img: {img1}, равна img: { img1: '... image content ...' }.

P.S. Ну и:

<div className='region__top__cards'>
  {product.map((product) => (
    <Cards key={product.title} title={product.title} img={product.img} price={product.price} oldprice={product.oldPrice} rate={product.rate}/>
  )}
</div>

https://developer.mozilla.org/en-US/docs/Web/HTML/...
и/или
https://developer.mozilla.org/en-US/docs/Glossary/AJAX

Ключ должен быть у самого верхнего элемента внутри цикла. В вашем случае это fragment:

<React.Fragment key={category}>
 <h2>...</h2>
 <ul>...</ul>
</React.Fragment>

Ошибка первая: вы в sliceHandler передаёте div-обёртку, а внутри функции думаете, что это какой-то его ребёнок.
Ошибка вторая: вы пытаетесь получить реактовское служебное свойство key через атрибут html-тега. Значение key даже через props нельзя получить, не говоря уже про html.

Давайте вы своими словами опишете, чего хотите добиться и зачем, а мы вам подскажем, как это сделать правильно.

А что, стрелочные функции не принимают аргументов или не возвращают результат? Или делают это как-то иначе? Или они не являются функциями?
Вопросы риторические.

"Говорите" про них ровно так же, как про обычные. Когда окажется важным, что это именно стрелочная функция (а это бывает довольно редко), так и уточняйте.

Нет, проблема не в том, что localStorage не успевает загрузиться. Проблема в том, что код выполняется на сервере, где никакого localStorage вообще нет.
Вам нужно пометить компонент как клиентский и тогда сервер не будет его исполнять.

Никакого ограничения по количеству в Битриксе нет.
Если под "пропадать" вы подразумеваете "заменяться другими" (раз потом пишете "перезаписываться"), то есть вероятность словить коллизию хэша, образующего название файла, но эта вероятность довольно мала.
Если же "пропадать" = "исчезать с диска", то проблема где-то в другом месте, сам по себе Битрикс ничего не удаляет.

Самое простое и надёжное - проверять наличие элемента каждые N секунд (например, 5):

setInterval(function () {
  const $element = document.querySelector("#content > div > div.taskblackout");

  if ($element && $element.style.display === 'block') {
    document.location.reload()
  }
}, 5000);

Единственный минус этого решения - задержка. Элемент может появиться сразу после срабатывания и провисит эти N секунд.
Ещё, если вы часто уходите с этой вкладки, может накопиться очередь из интервалов - в этом случае лучше заменить на setTimeout, который внутри будет вызывать следующий setTimeout:

const check = () => {
  const $element = document.querySelector("#content > div > div.taskblackout");

  if ($element && $element.style.display === 'block') {
    document.location.reload()
  } else {
    setTimeout(check, 5000);
  }
};

setTimeout(check, 5000);

уверен, есть более лаконичное решение

Нет, магического способа «сделать хорошо» не существует.

Это невозможно сделать на чистом CSS.

Почему бы не получать кнопку просто через event.target? А this прибить к вашему объекту.