Skip to content

chore: migrate components and delete dupes - #1012

Open
santipalenque wants to merge 1 commit into
masterfrom
fix/replace-mui-formik-for-uicore
Open

chore: migrate components and delete dupes#1012
santipalenque wants to merge 1 commit into
masterfrom
fix/replace-mui-formik-for-uicore

Conversation

@santipalenque

@santipalenque santipalenque commented Jul 16, 2026

Copy link
Copy Markdown

https://app.clickup.com/t/9014802374/86bat8h0n

Summary by CodeRabbit

  • New Features

    • Improved event type form dropdowns with clearer placeholders and selected-option labels.
  • Refactor

    • Updated forms and dialogs to use shared UI form controls for more consistent input, selection, checkbox, and switch experiences.
    • Removed several legacy form controls and sponsorship input implementations replaced by shared equivalents.
  • Tests

    • Removed tests for retired legacy form controls and sponsorship inputs.

@santipalenque
santipalenque force-pushed the fix/replace-mui-formik-for-uicore branch from e407e8c to e47f7bd Compare July 28, 2026 18:08
@coderabbitai

coderabbitai Bot commented Jul 28, 2026

Copy link
Copy Markdown

Review Change Stack

📝 Walkthrough

Walkthrough

The PR migrates Formik/MUI input consumers to openstack-uicore-foundation, removes local input components and tests, documents intentionally retained wrappers, and updates event select value rendering.

Changes

Formik foundation migration

Layer / File(s) Summary
Foundation inputs and retained local boundaries
src/components/forms/*, src/components/mui/..., src/pages/sponsors-global/...
Core forms and shared components use foundation Formik inputs; comments document local async-select, color-field, and datetime-picker boundaries.
Event select migration and display mapping
src/pages/events/components/event-type-dialog.js, src/pages/events/components/__tests__/event-type-dialog.test.js
EventTypeDialog uses the foundation select, maps selected values to labels, renders translated placeholders, and updates its Jest mock.
Sponsor form input rewiring
src/pages/sponsors/...
Sponsor dialogs, templates, forms, and user workflows switch Formik/MUI inputs to foundation modules without changing surrounding form logic.
Local component and test removal
src/components/mui/formik-inputs/*, src/components/mui/__tests__/*
Local Formik/MUI input implementations and associated test suites are deleted, including select, checkbox, radio, pricing, quantity, sponsor, and sponsorship components.

Estimated code review effort: 3 (Moderate) | ~20 minutes

Possibly related PRs

Suggested reviewers: smarcet, martinquiroga-exo, priscila-moneo

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title concisely captures the main change: migrating components and removing duplicate local implementations.
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check ✅ Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check ✅ Passed Check skipped because no linked issues were found for this pull request.
✨ Finishing Touches
📝 Generate docstrings
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch fix/replace-mui-formik-for-uicore

Comment @coderabbitai help to get the list of available commands.

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🧹 Nitpick comments (1)
src/pages/events/components/__tests__/event-type-dialog.test.js (1)

37-47: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

Cover the migrated select display behavior.

This mock ignores renderValue, so the new translated placeholder and selected-label mapping are not exercised. Add a focused test (or make the mock model renderValue) for empty and populated select values.

🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@src/pages/events/components/__tests__/event-type-dialog.test.js` around lines
37 - 47, Update the MockSelect in the event-type dialog tests to invoke its
renderValue behavior, or add focused coverage that models it, for both empty and
populated values. Assert that empty selections show the translated placeholder
and populated selections use the translated selected-label mapping.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@src/pages/sponsors-global/form-templates/form-template-popup.js`:
- Line 20: Remove the legacy formik={formik} prop from migrated foundation
fields in src/pages/sponsors-global/form-templates/form-template-popup.js (lines
20-20) and src/pages/sponsors-global/form-templates/sponsor-inventory-popup.js
(lines 23-24), including the MuiFormikTextField and quantity-field usages;
retain their existing field wiring.

---

Nitpick comments:
In `@src/pages/events/components/__tests__/event-type-dialog.test.js`:
- Around line 37-47: Update the MockSelect in the event-type dialog tests to
invoke its renderValue behavior, or add focused coverage that models it, for
both empty and populated values. Assert that empty selections show the
translated placeholder and populated selections use the translated
selected-label mapping.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: a470257c-02df-4b56-a31d-22ae3d11175e

📥 Commits

Reviewing files that changed from the base of the PR and between 52e285c and e47f7bd.

📒 Files selected for processing (51)
  • src/components/forms/admin-access-form.js
  • src/components/forms/sponsor-settings-form/index.js
  • src/components/mui/__tests__/mui-formik-checkbox-group.test.js
  • src/components/mui/__tests__/mui-formik-file-size-field.test.js
  • src/components/mui/__tests__/mui-formik-quantity-field.test.js
  • src/components/mui/__tests__/mui-formik-radio-group.test.js
  • src/components/mui/__tests__/mui-sponsor-input.test.js
  • src/components/mui/formik-inputs/company-input-mui.js
  • src/components/mui/formik-inputs/item-price-tiers.js
  • src/components/mui/formik-inputs/mui-formik-async-select.js
  • src/components/mui/formik-inputs/mui-formik-checkbox-group.js
  • src/components/mui/formik-inputs/mui-formik-checkbox.js
  • src/components/mui/formik-inputs/mui-formik-color-field.js
  • src/components/mui/formik-inputs/mui-formik-datetimepicker.js
  • src/components/mui/formik-inputs/mui-formik-discountfield.js
  • src/components/mui/formik-inputs/mui-formik-dropdown-checkbox.js
  • src/components/mui/formik-inputs/mui-formik-dropdown-radio.js
  • src/components/mui/formik-inputs/mui-formik-file-size-field.js
  • src/components/mui/formik-inputs/mui-formik-pricefield.js
  • src/components/mui/formik-inputs/mui-formik-quantity-field.js
  • src/components/mui/formik-inputs/mui-formik-radio-group.js
  • src/components/mui/formik-inputs/mui-formik-select-group.js
  • src/components/mui/formik-inputs/mui-formik-select.js
  • src/components/mui/formik-inputs/mui-formik-summit-addon-select.js
  • src/components/mui/formik-inputs/mui-formik-switch.js
  • src/components/mui/formik-inputs/mui-formik-textfield.js
  • src/components/mui/formik-inputs/mui-formik-timepicker.js
  • src/components/mui/formik-inputs/mui-sponsor-input.js
  • src/components/mui/formik-inputs/sponsorship-input-mui.js
  • src/components/mui/formik-inputs/sponsorship-summit-select-mui.js
  • src/components/mui/mui-qr-badge-popup.js
  • src/components/mui/summit-addon-select.js
  • src/pages/events/components/__tests__/event-type-dialog.test.js
  • src/pages/events/components/event-type-dialog.js
  • src/pages/sponsors-global/form-templates/form-template-popup.js
  • src/pages/sponsors-global/form-templates/sponsor-inventory-popup.js
  • src/pages/sponsors/popup/add-sponsor-popup.js
  • src/pages/sponsors/popup/edit-tier-popup.js
  • src/pages/sponsors/sponsor-form-item-list-page/components/sponsor-form-item-form.js
  • src/pages/sponsors/sponsor-forms-list-page/components/form-template/form-template-form.js
  • src/pages/sponsors/sponsor-page/tabs/sponsor-badge-scans/edit-badge-scan-popup.js
  • src/pages/sponsors/sponsor-page/tabs/sponsor-forms-tab/components/add-sponsor-form-template-popup/index.js
  • src/pages/sponsors/sponsor-page/tabs/sponsor-forms-tab/components/customized-form/customized-form.js
  • src/pages/sponsors/sponsor-page/tabs/sponsor-general-form/add-extra-question-popup.js
  • src/pages/sponsors/sponsor-page/tabs/sponsor-general-form/add-tier-popup.js
  • src/pages/sponsors/sponsor-page/tabs/sponsor-general-form/manage-tier-addons-popup.js
  • src/pages/sponsors/sponsor-page/tabs/sponsor-pages-tab/components/add-sponsor-page-template-popup/index.js
  • src/pages/sponsors/sponsor-page/tabs/sponsor-users-list-per-sponsor/components/sponsor-user-form.js
  • src/pages/sponsors/sponsor-users-list-page/components/edit-user-popup/sponsor-section.js
  • src/pages/sponsors/sponsor-users-list-page/components/edit-user-popup/sponsor-user-form.js
  • src/pages/sponsors/sponsor-users-list-page/components/process-request-form.js
💤 Files with no reviewable changes (25)
  • src/components/mui/formik-inputs/mui-formik-quantity-field.js
  • src/components/mui/tests/mui-formik-checkbox-group.test.js
  • src/components/mui/tests/mui-sponsor-input.test.js
  • src/components/mui/formik-inputs/mui-formik-switch.js
  • src/components/mui/formik-inputs/mui-formik-file-size-field.js
  • src/components/mui/formik-inputs/mui-formik-summit-addon-select.js
  • src/components/mui/tests/mui-formik-radio-group.test.js
  • src/components/mui/formik-inputs/mui-formik-checkbox-group.js
  • src/components/mui/formik-inputs/mui-formik-checkbox.js
  • src/components/mui/formik-inputs/mui-formik-dropdown-checkbox.js
  • src/components/mui/formik-inputs/mui-formik-select.js
  • src/components/mui/formik-inputs/mui-formik-textfield.js
  • src/components/mui/formik-inputs/company-input-mui.js
  • src/components/mui/formik-inputs/mui-formik-select-group.js
  • src/components/mui/tests/mui-formik-file-size-field.test.js
  • src/components/mui/tests/mui-formik-quantity-field.test.js
  • src/components/mui/formik-inputs/mui-formik-pricefield.js
  • src/components/mui/formik-inputs/mui-formik-discountfield.js
  • src/components/mui/formik-inputs/mui-sponsor-input.js
  • src/components/mui/formik-inputs/mui-formik-radio-group.js
  • src/components/mui/formik-inputs/sponsorship-summit-select-mui.js
  • src/components/mui/formik-inputs/mui-formik-dropdown-radio.js
  • src/components/mui/summit-addon-select.js
  • src/components/mui/formik-inputs/sponsorship-input-mui.js
  • src/components/mui/formik-inputs/mui-formik-timepicker.js

import * as yup from "yup";
import AdditionalInputList from "openstack-uicore-foundation/lib/components/mui/formik-inputs/additional-input-list";
import MuiFormikTextField from "../../../components/mui/formik-inputs/mui-formik-textfield";
import MuiFormikTextField from "openstack-uicore-foundation/lib/components/mui/formik-inputs/textfield";

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick win

🧩 Analysis chain

🏁 Script executed:

#!/bin/bash
set -euo pipefail

printf '\n## Relevant call sites\n'
sed -n '120,200p' src/pages/sponsors-global/form-templates/form-template-popup.js
printf '\n---\n'
sed -n '100,220p' src/pages/sponsors-global/form-templates/sponsor-inventory-popup.js

printf '\n## Imported foundation field implementations\n'
# locate the source files in repo, if present
fd -a 'textfield' src node_modules 2>/dev/null | head -n 20
fd -a 'quantity-field' src node_modules 2>/dev/null | head -n 20

Repository: fntechgit/summit-admin

Length of output: 8723


🏁 Script executed:

#!/bin/bash
set -euo pipefail

printf '\n## quantity-field implementation\n'
cat -n node_modules/openstack-uicore-foundation/lib/components/mui/formik-inputs/quantity-field.js | sed -n '1,240p'

printf '\n## textfield implementation lookup\n'
fd -a 'textfield.js' node_modules/openstack-uicore-foundation/lib/components/mui/formik-inputs 2>/dev/null || true
fd -a 'text-field.js' node_modules/openstack-uicore-foundation/lib/components/mui/formik-inputs 2>/dev/null || true
fd -a 'textfield' node_modules/openstack-uicore-foundation/lib/components/mui/formik-inputs 2>/dev/null || true

Repository: fntechgit/summit-admin

Length of output: 4128


🏁 Script executed:

#!/bin/bash
set -euo pipefail

printf '\n## textfield implementation\n'
cat -n node_modules/openstack-uicore-foundation/lib/components/mui/formik-inputs/textfield.js | sed -n '1,220p'

printf '\n## inventory of formik props in the two popup files\n'
rg -n 'formik=\{formik\}' src/pages/sponsors-global/form-templates/form-template-popup.js src/pages/sponsors-global/form-templates/sponsor-inventory-popup.js

Repository: fntechgit/summit-admin

Length of output: 3021


Drop the legacy formik prop from migrated foundation fields.

openstack-uicore-foundation/lib/components/mui/formik-inputs/textfield and quantity-field use useField and forward unknown props to MUI, so formik={formik} is just an unsupported prop on these inputs.

  • src/pages/sponsors-global/form-templates/form-template-popup.js
  • src/pages/sponsors-global/form-templates/sponsor-inventory-popup.js
📍 Affects 2 files
  • src/pages/sponsors-global/form-templates/form-template-popup.js#L20-L20 (this comment)
  • src/pages/sponsors-global/form-templates/sponsor-inventory-popup.js#L23-L24
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@src/pages/sponsors-global/form-templates/form-template-popup.js` at line 20,
Remove the legacy formik={formik} prop from migrated foundation fields in
src/pages/sponsors-global/form-templates/form-template-popup.js (lines 20-20)
and src/pages/sponsors-global/form-templates/sponsor-inventory-popup.js (lines
23-24), including the MuiFormikTextField and quantity-field usages; retain their
existing field wiring.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant