Рефактор запросов к `wp`

[Nelfimov]

С чем связан запрос на фичу?

В связи с переходом на ACF в wordpress необходимо пересмотреть все запросы по проекту и оптимизировать их.

Расскажите как вы это себе видите

• [x] настроить кэширование
• [x] рефактор всех страниц и запросов

  • 139

  • 140

  • 141

  • 142

  • 138

  • 137

  • 135

  • 134

  • 136

• [x] настроить авто генерацию схемы

Приложите пример реализаций

No response

[oxiqod]

что сделано:

• hero : title, descriptions, course conditions, runningLine
• price : title, fullPrice, monthlyPrice, discount, figures
• рефактор на plural сообщения react-intl
• начата очистка от устаревших запросов

для страниц: connacol, seventh-heaven, polyrhythmic-keys, fifth-dimension, feeling-of-time

~ что осталось:

• главная страница
• общие фрагменты:
  • header
  • footer
  • faq
  • about
• рефактор и типизация компонентов
• backgrounds
• получение данных по ssr
• программы для курсов
• стр контакты
• сайдбар оплаты

[oxiqod]

что сделано:

• в wp загружены сжатые фоны для курсов, исправлены некоторые поля в соответствии с дизайном
• ssr и background для всех individual courses
• рефактор ( удаление старых запросов, корректировки некоторых компонентов, устранение ошибок )
• в feeling-of-time добавлены данные для course program

что осталось:

• добавить в в wp данные для общих фрагментов, главной страницы, контактов
• страница открытие ритма, контакты, ученики, главная, сайдбар оплаты
• дополнить индивидуальные курсы данными для course program
• рефактор, типизация

[oxiqod]

что сделано:

• course program для мобильной и десктопной версии индивидуальных курсов
• рефактор, удаление старых запросов, переиспользование bulleted-list
• price для мобильной версии индивидуальных курсов
• рефактор полей и изображений WP (teacher, cta, faq, process)
• общий фрагмент Teacher
• общий фрагмент Сta
• общий фрагмент Faq
• общий фрагмент CourseProcess

что осталось:

• header
• footer
• main
• opening-the-rhythm-page
• contacts
• payment

[oxiqod]

@Nelfimov

Скоуп

новые разделы для заполнения

Описание

Нужно добавить данные для страниц Contact, Contract-offer и PrivacyPolicy

• как я поняла необходимо по аналагии с Индивидуальными курсами и Общими фрагментами создать вкладку в ВП что бы заполнять поля, которые заранее выставлю в ACF
• как в AFC создать группу полей и составить их иерархию я примерно понимаю, но как подключить вкладку например Контакты и внести данные в поля - не совсем очевидно

Вопрос

как грамотно реализовать новые разделы в WP для страниц, какие должны быть шаги для выполнения?

[Nelfimov]

Делай в рамках общих фрагментов.

[oxiqod]

что сделано:

• создание и рефактор полей в WP для страниц Контактов, Политики конфиденциальности и Открытия ритма
• частично Header
• Footer
• Contacts page
• Opening-the-rhythm page
• Privacy-policy page

что осталось:

• main page
• payment для всех курсов
• header (список курсов)
• страница contract-offer (?)

[oxiqod]

@Nelfimov

подскажи пожуйлуйста:

Делай в рамках общих фрагментов.

• касаемо main page как поступить? тоже в общих или отделную вкладку необходимо будет делать?

---

• насчет страницы contract-offer, не вижу ее в дизайне, в вп тоже не нашла ничего о ней, по коду она состоит из заголовка и мапает массив строк, также имеет свой background, где найти информацию что бы заполнить эту страницу? закинула пока моки:

[Nelfimov]

касаемо main page как поступить? тоже в общих или отделную вкладку необходимо будет делать?

В общих

насчет страницы contract-offer, не вижу ее в дизайне, в вп тоже не нашла ничего о ней, по коду она состоит из заголовка и мапает массив строк, также имеет свой background, где найти информацию что бы заполнить эту страницу? закинула пока моки:

Это договор оферты. Закидывай в общие, сделай аналогичное этому: https://neolit.club/about/agreement/

Реальный договор заполнит заказчик.

[oxiqod]

что сделано:

• main
• contract-offer
• header

что осталось:

• типизация
• form на страницах

[oxiqod]

@Nelfimov можешь пожалуйста додсказать, на сколько я вижу в ВП нет мутации для форм, как реализовать изменения данных, чтобы затем получить их для проверки что форма отправилась?

[Nelfimov]

@Nelfimov можешь пожалуйста додсказать, на сколько я вижу в ВП нет мутации для форм, как реализовать изменения данных, чтобы затем получить их для проверки что форма отправилась?

Посмотри тут - https://wp.drumin.pro/wp-admin/admin.php?page=ninja-forms#widgets

Ну и важно понимать про какие ты формы говоришь - там как минимум есть

• форма для контакта
• форма оплаты

@TorinAsakura мы остаемся на ninja forms?

[oxiqod]

@Nelfimov

Посмотри тут - https://wp.drumin.pro/wp-admin/admin.php?page=ninja-forms#widgets

вижу форму для консультации, а что касается оформления покупки?

[Nelfimov]

Там задействован уже платежный шлюз - Тинькофф. Нам нужно данные из формы передать в платежку.

[oxiqod]

@Nelfimov не могу разобраться что делать с ui/формой

шаги оплаты:

• в модалке показываем курс, оплата при рассрочке и оплата разовая
• далее по коду в компонент <Form /> передается пропс amount который получается из хука useContent (он возвращает сумму к оплате в зависимости от выбраного свича (рассрочка или единоразовый платеж)), вторым пропсом форма принимает тип (платеж или консультация)
• далее я получаю ошибку, запроса, т.к. там лежит старый запрос данных

```typescript const GET_FORM_DATA_BY_ID = gql` query GetFormDataById($id: ID!) { form(id: $id) { fields { nodes { fieldId label } } } } ` const useFormData = (id) => { const { data, error } = useQuery(GET_FORM_DATA_BY_ID, { variables: { id } }) if (error) { throw new Error(error.message) } if (data) { return data.form.fields.nodes } return [] } export { useFormData } ```

• также есть хук useActionHook, который является мутацией для отправки формы, он также недействителен т.к. устарел

```typescript const SUBMIT_FORM = gql` mutation SubmitForm($name: String!, $phone: String!, $telegram: String!) { submitForm( input: { formId: 2 data: [{ id: 5, value: $name }, { id: 6, value: $phone }, { id: 7, value: $telegram }] } ) { errors { fieldId message slug } message success } } ` const useSubmitForm = () => { const [submitForm, { data, error }] = useMutation(SUBMIT_FORM) if (data) { return [submitForm, data.submitForm, error] } return [submitForm, {}, error] } export { useSubmitForm } ```

также я вижу захардкоженный ID который передается в этот самый запрос, тоже плохо понимаю связь

вопрос:

Можешь помочь разобраться

• если нужно переписать запрос для ВП (GET_FORM_DATA_BY_ID), что должно находиться в полях?
• мутация (SUBMIT_FORM) не описана в ВП, ее видимо тоже нужно создавать (в ниндзя формах только консультации) но они при этом одинаковые, можно ли использовать ее?

актуальная ветка: connacol-wp-data компонент где используется форма в курсе Коннакол: content-desktop.component.tsx

[Nelfimov]

если нужно переписать запрос для ВП (GET_FORM_DATA_BY_ID), что должно находиться в полях?

Раньше использовался этот плагин https://github.com/toriphes/wp-graphql-ninja-forms

Он расшаривал форму и давал доступ к сабмиту. Однако с грейдом всех версий этот плагин стал конфликтовать с остальным.

Поэтому пока так:

• сделай фрагмент формы
• получай лэйблы и ID с него
• сабмит обвесь TODO

[oxiqod]

что сделано:

wp

• вынос данных в новые записи общих фрагментов, получение по ID

• добавление записи для модального окна Ученики

  общие фрагменты

• добавление данных для модального окна Студенты
• рефактор запросов, хуков, типов:
  • main
  • contacts
  • privacy-policy
  • contract-offer
  • header
  • footer
  • teacher
  • faq
  • process
  • consultation
• добавление запроса, хука, типов и ssr получения аудио для страниц:
  • main
  • connacol
  • popolyrhythmic-keys
  • feeling-of-time
  • seventh-heaven

  • fifth-dimension

    opening-the-rhythm

• типизация, рефактор кода, данные для модального окна оплаты
• добавление ssr для получения аудио

[oxiqod]

@Nelfimov

из TODO на данный момент остались:

• консультация
• PageID для страницы Contract-offer ( в коде используется только в Seo)