Copilot Edits

Мультифайлове редагування з GitHub Copilot — edit mode, working sets та практичні приклади

copiloteditsmulti-filerefactoring

📎ОФІЦІЙНА ДОКУМЕНТАЦІЯ

GitHub Copilot Documentation→

Що таке Copilot Edits?

Copilot Edits — це режим мультифайлового редагування в GitHub Copilot, який дозволяє описати зміни натуральною мовою, а Copilot застосує їх одночасно до кількох файлів. На відміну від inline chat, Edits працює на рівні проєкту.

ℹ️Інформація

Copilot Edits показує diff-перегляд запропонованих змін перед їх застосуванням, що дозволяє переглянути та прийняти або відхилити кожну зміну.

Як відкрити Copilot Edits

У VS Code:

Відкрийте Copilot Chat панель (Ctrl+Alt+I)
Перемкніть режим на Edit (значок олівця у верхній частині панелі)
Або використовуйте Command Palette: Copilot: Open Edits

Working Set

Working Set — це набір файлів, які Copilot Edits буде аналізувати та модифікувати. Правильне формування working set критично важливе для якості результату.

Додавання файлів до Working Set

# Кнопка "Add Files" у панелі Edits
# Або перетягніть файли з Explorer
# Або використовуйте #file: у промпті

Стратегії формування Working Set

Стратегія	Коли використовувати
Мінімальний набір	Прості зміни в 2-3 файлах
Модуль повністю	Рефакторинг одного модуля
Feature slice	Зміни, що торкаються одного feature
Весь проєкт	Глобальні зміни (перейменування, міграція)

⚠️Увага

Занадто великий Working Set може погіршити якість — модель намагатиметься змінити забагато файлів. Починайте з мінімального набору і додавайте файли за потреби.

Практичні приклади

Додавання TypeScript типів

Working Set: src/utils/api.js, src/types/index.ts

Промпт: "Конвертуй api.js у TypeScript. 
Додай інтерфейси для всіх API-відповідей у types/index.ts. 
Перейменуй файл на api.ts."

Рефакторинг компонента

Working Set: 
  src/components/UserProfile.tsx
  src/components/UserAvatar.tsx (новий)
  src/components/UserInfo.tsx (новий)

Промпт: "Розбий UserProfile на два підкомпоненти:
1. UserAvatar — аватар з fallback на ініціали
2. UserInfo — ім'я, email, роль
Оновити UserProfile щоб використовувати нові компоненти."

Міграція API-шару

Working Set:
  src/api/users.ts
  src/api/products.ts
  src/api/orders.ts

Промпт: "Замінити fetch на axios у всіх API-файлах.
Додати interceptor для автентифікації.
Додати retry-логіку для 5xx помилок."

Додавання error handling

Working Set:
  src/services/PaymentService.ts
  src/services/OrderService.ts
  src/types/errors.ts

Промпт: "Додай кастомні error classes у errors.ts:
PaymentError, OrderError, ValidationError.
Замінити generic throw new Error() на типізовані помилки
у PaymentService та OrderService."

Workflow з Copilot Edits

Крок 1: Визначте задачу

Опишіть, що потрібно зробити, якомога конкретніше.

Крок 2: Сформуйте Working Set

Додайте лише релевантні файли — ті, що потрібно змінити, та ті, що дають контекст.

Крок 3: Напишіть промпт

Будьте конкретними. Вкажіть:

Що саме змінити
Які стандарти дотримуватися
Що НЕ змінювати

Крок 4: Перегляньте diff

Copilot Edits покаже зміни для кожного файлу. Перегляньте:

Чи зміни відповідають запиту
Чи немає непотрібних змін
Чи збережена логіка

Крок 5: Прийміть або відхиліть

Accept — прийняти всі зміни
Discard — відхилити всі
Або прийміть/відхиліть зміни для кожного файлу окремо

Порівняння Edit Mode та Agent Mode

Функція	Edit Mode	Agent Mode
Мультифайлове редагування	Так	Так
Виконання команд у терміналі	Ні	Так
Ітеративне виправлення	Ручне	Автоматичне
Контроль змін	Попередній перегляд diff	Агент застосовує сам
Створення нових файлів	Так	Так
Запуск тестів	Ні	Так

💡Порада

Використовуйте Edit Mode, коли хочете повний контроль над змінами з попереднім переглядом. Agent Mode — коли довіряєте Copilot ітеративно вирішити задачу.

Наступні кроки

Agent Mode

Автономний режим для складніших задач

Кастомні інструкції

Налаштуйте поведінку Copilot для вашого проєкту

Пов'язані