Руководство по миграции

Руководства по миграции на Form Guardian с других решений или обновлению версий.

📦 Миграция с

• LocalStorage
• Кастомного решения
• react-autosave
• Обновление версий

С localStorage

До (localStorage)

function MyForm() {
  const [values, setValues] = useState({});

  useEffect(() => {
    const saved = localStorage.getItem('my-form');
    if (saved) {
      setValues(JSON.parse(saved));
    }
  }, []);

  useEffect(() => {
    localStorage.setItem('my-form', JSON.stringify(values));
  }, [values]);
}

После (Form Guardian)

import { useFormAutosave } from '@form-guardian/react';

function MyForm() {
  const { formRef } = useFormAutosave('my-form', {
    autoRestore: true,
  });

  return <form ref={formRef}>{/* ... */}</form>;
}

Преимущества

• ✅ Лучшее хранилище: IndexedDB имеет больше места (50MB+ против 5-10MB)
• ✅ Автоматически: Не нужно отслеживать значения вручную
• ✅ Поддержка TTL: Автоматическое истечение черновиков
• ✅ Лучшая производительность: Неблокирующие операции

Скрипт миграции

import { saveDraftCore } from '@form-guardian/core';

async function migrateDraftsFromLocalStorage() {
  const formIds = ['contact-form', 'registration-form'];

  for (const formId of formIds) {
    const key = `draft-${formId}`;
    const data = localStorage.getItem(key);

    if (data) {
      try {
        const values = JSON.parse(data);
        await saveDraftCore(formId, values);
        console.log(`✅ Мигрировано ${formId}`);
        localStorage.removeItem(key);
      } catch (error) {
        console.error(`❌ Ошибка миграции ${formId}:`, error);
      }
    }
  }
}

migrateDraftsFromLocalStorage();

Обновление версий

С 0.x на 1.x

Критические изменения

1. Изменены имена пакетов

   # До
   npm install form-guardian
   
   # После
   npm install @form-guardian/react

2. Пути импорта

   // До
   import { useFormAutosave } from 'form-guardian';
   
   // После
   import { useFormAutosave } from '@form-guardian/react';

3. Переименованы опции

   • delay → debounceMs
   • restore → autoRestore
   • prefix → storagePrefix

💬 Нужна помощь?

1. Посмотрите Решение проблем
2. Откройте GitHub issue