// Мой блог — посты Telegram-канала @demchenkolegal с фильтром по категориям.
(function () {
  const { Tag } = window.ArthurDemchenkoBrandSystem_fe6514;

  const Arrow = () => (
    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.6" strokeLinecap="round" strokeLinejoin="round"><path d="M7 17 17 7M9 7h8v8"/></svg>
  );

  const CHANNEL = "https://t.me/demchenkolegal";
  const LINKEDIN = "https://www.linkedin.com/in/arthur-demchenko/";

  const CATEGORIES = [
    { area: "all", label: "Все" },
    { area: "arbitration", label: "Арбитраж" },
    { area: "itip", label: "IT/IP" },
    { area: "crypto", label: "Криптовалюты" },
    { area: "ai", label: "Legal-Tech" },
  ];

  // Посты блога. Каждый пост: date, area (arbitration|itip|crypto|ai),
  // title, excerpt (короткий сникпик — первый абзац), url (ссылка на сам пост).
  // Добавлять/удалять посты удобно через скилл /blog-post (см. .claude/skills/blog-post).
  const POSTS = [
    { date: "Июнь 2026", area: "arbitration", title: "Правовое регулирование стейкинга в Республике Беларусь", excerpt: "Поскольку блокчейн по определению является распределённым реестром без конкретного оператора или администратора, его корректную и бесперебойную деятельность нужно как-то обеспечивать. Для этого созданы разные виды консенсуальных алгоритмов — способов, как валидаторы (те, кто подтверждают транзакции в блокчейне, создавая новые блоки в нём) договариваются между собой, какие блоки создавать и включать в общую цепь, а какие — отклонять.", url: "https://t.me/demchenkolegal/88" },
    { date: "Июнь 2026", area: "crypto", title: "Стейкинг: что это и как его регулирует Положение о криптобанках", excerpt: "Стейкинг — это блокировка токенов в сети для поддержания её работы в обмен на вознаграждение. Разбираю, как новое Положение о криптобанках квалифицирует такой доход и какие требования предъявляет к операторам.", url: CHANNEL },
    { date: "Июнь 2026", area: "crypto", title: "Установлены случаи использования токенов как средства расчёта", excerpt: "Регулятор закрепил закрытый перечень ситуаций, когда расчёты токенами допустимы. Объясняю, что это значит для бизнеса и где проходит граница между расчётом и инвестицией.", url: CHANNEL },
    { date: "Май 2026", area: "crypto", title: "Залог токенов: как работает обеспечение в крипте", excerpt: "Можно ли заложить цифровой актив и как оформить такой залог, чтобы он был исполнимым. Смотрю на механику обременения токенов и риски при обращении взыскания.", url: CHANNEL },
    { date: "Май 2026", area: "crypto", title: "Заём токенов: чем он отличается от криптовклада", excerpt: "Заём и вклад в крипте легко спутать, но правовые последствия у них разные. Разбираю, кто несёт риск, как начисляется доход и почему формулировка договора решает всё.", url: CHANNEL },
    { date: "Май 2026", area: "arbitration", title: "Арбитражная оговорка: как составить её так, чтобы она работала", excerpt: "Большинство споров об арбитраже начинается с дефектной оговорки. Показываю обязательные элементы и типовые ошибки, из-за которых оговорка признаётся неисполнимой.", url: CHANNEL },
    { date: "Апрель 2026", area: "arbitration", title: "Признание и исполнение иностранных арбитражных решений: Нью-Йоркская конвенция на практике", excerpt: "Нью-Йоркская конвенция работает в 170+ странах, но отказы в исполнении всё равно случаются. Разбираю основания для отказа и как к ним готовиться ещё на стадии разбирательства.", url: CHANNEL },
    { date: "Апрель 2026", area: "itip", title: "Отчуждение прав на ПО: что обязательно прописать в договоре", excerpt: "Передача исключительного права на софт — не то же самое, что лицензия. Перечисляю условия, без которых договор отчуждения рискует быть переквалифицирован или признан незаключённым.", url: CHANNEL },
    { date: "Март 2026", area: "itip", title: "Открытые лицензии (MIT, GPL): как не нарушить условия в коммерческом продукте", excerpt: "Open-source не значит «бесплатно и без обязательств». Объясняю разницу между permissive- и copyleft-лицензиями и где проходит граница, после которой придётся раскрыть свой код.", url: CHANNEL },
    { date: "Март 2026", area: "ai", title: "Кто отвечает за ошибку ИИ-ассистента: первые подходы регуляторов", excerpt: "Когда ИИ-инструмент даёт неверный совет, ответственность ложится на разработчика, оператора или пользователя? Смотрю на первые регуляторные подходы к распределению риска.", url: CHANNEL },
    { date: "Февраль 2026", area: "ai", title: "Legal-Tech меняет профессию: что юристу автоматизировать уже сегодня", excerpt: "Часть рутины юриста уже сейчас можно отдать инструментам без потери качества. Разбираю, какие задачи безопасно автоматизировать и где человек по-прежнему незаменим.", url: CHANNEL },
    { date: "Февраль 2026", area: "arbitration", title: "Чрезвычайный арбитр: обеспечительные меры до формирования состава", excerpt: "Что делать, если меры нужны срочно, а арбитраж ещё не сформирован. Рассказываю про институт чрезвычайного арбитра и его соотношение с государственными судами.", url: CHANNEL },
    { date: "Январь 2026", area: "crypto", title: "Комплаенс криптобиржи: на что смотрит регулятор ПВТ", excerpt: "Лицензия криптобиржи — это про процедуры, а не только про капитал. Перечисляю ключевые требования AML/KYC и зоны, где регулятор ПВТ проверяет особенно тщательно.", url: CHANNEL },
  ];

  const VISIBLE = 4; // сколько постов показываем до «Посмотреть все»

  const ruArea = { arbitration: "Арбитраж", itip: "IT/IP", crypto: "Криптовалюты", ai: "Legal-Tech" };

  function Writing() {
    const [filter, setFilter] = React.useState("all");
    const [showAll, setShowAll] = React.useState(false);
    const posts = filter === "all" ? POSTS : POSTS.filter((p) => p.area === filter);
    const shown = showAll ? posts : posts.slice(0, VISIBLE);

    // При смене категории снова сворачиваем список.
    const pick = (area) => { setFilter(area); setShowAll(false); };

    return (
      <section className="w-band w-band--dark" id="writing">
        <div className="w-inner">
          <h2 className="w-section-title">Мой блог в Telegram</h2>
          <p className="w-lead w-muted-dark" style={{ marginTop: 12 }}>
            Пишу о праве доступно для каждого.
          </p>

          {/* Фильтр по категориям */}
          <div className="w-catfilter">
            {CATEGORIES.map((c) => (
              <button
                key={c.area}
                type="button"
                className={"w-catbtn" + (filter === c.area ? " w-catbtn--active" : "")}
                onClick={() => pick(c.area)}
              >
                {c.area !== "all" && <span className={"w-catbtn__dot w-catbtn__dot--" + c.area} />}
                {c.label}
              </button>
            ))}
          </div>

          {/* Карточки постов */}
          {posts.length ? (
            <div className="w-cards">
              {shown.map((p, i) => (
                <a className="w-card" href={p.url || CHANNEL} target="_blank" rel="noopener" key={i}>
                  <div className="w-card__top">
                    <Tag area={p.area} tone="dark">{ruArea[p.area]}</Tag>
                    <span className="w-card__src">Telegram</span>
                  </div>
                  <div className="w-card__title">{p.title}</div>
                  {p.excerpt && <p className="w-card__excerpt">{p.excerpt}</p>}
                  <div className="w-card__foot">
                    <span className="w-card__date">{p.date}</span>
                    <span className="w-card__more">Читать полностью <span className="w-card__arrow"><Arrow/></span></span>
                  </div>
                </a>
              ))}
            </div>
          ) : (
            <p className="w-cards-empty">В этой категории пока нет постов.</p>
          )}

          {/* Посмотреть все / свернуть */}
          {posts.length > VISIBLE && (
            <div className="w-writing__more">
              <button type="button" className="w-morebtn" onClick={() => setShowAll((v) => !v)}>
                {showAll ? "Свернуть" : "Посмотреть все (" + posts.length + ")"}
                <span className={"w-morebtn__chev" + (showAll ? " w-morebtn__chev--up" : "")}>
                  <svg viewBox="0 0 24 24" width="16" height="16" fill="none" stroke="currentColor" strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round"><path d="m6 9 6 6 6-6"/></svg>
                </span>
              </button>
            </div>
          )}
        </div>
      </section>
    );
  }
  window.Writing = Writing;
})();