refactor: move input to app#18819
Merged
Merged
Conversation
Contributor
|
Warning Rate limit exceeded
You’ve run out of usage credits. Purchase more in the billing tab. ⌛ How to resolve this issue?After the wait time has elapsed, a review can be triggered using the We recommend that you space out your commits to avoid hitting the rate limit. 🚦 How do rate limits work?CodeRabbit enforces hourly rate limits for each developer per organization. Our paid plans have higher rate limits than the trial, open-source and free plans. In all cases, we re-allow further reviews after a brief timeout. Please see our FAQ for further information. ℹ️ Review info⚙️ Run configurationConfiguration used: Path: .coderabbit.yaml Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (9)
📝 WalkthroughWalkthroughConsolidates Input into libs/form-component: refactors Input props to use plain strings and a caller-provided characterLimit, adds FormattedInput and NumericInput wrappers, exposes an Input barrel, adds stories and tests, and migrates frontend consumers to import from ChangesInput Component Library Refactoring
Frontend Input Integration and Consumer Migration
Estimated code review effort 🎯 3 (Moderate) | ⏱️ ~25 minutes Possibly related PRs
Suggested labels
Suggested reviewers
🚥 Pre-merge checks | ✅ 4✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
github-actions
Bot
added
skip-releasenotes
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
Contributor
There was a problem hiding this comment.
Actionable comments posted: 2
🤖 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 `@libs/form-component/src/app-components/Flex/Flex.tsx`:
- Around line 10-16: IGridStyling now exposes xl but the Flex component never
maps size.xl into the generated CSS classes, so add handling for size.xl where
classes are composed in Flex.tsx: update the class-generation logic (the
function/block that reads the size prop and creates breakpoint classes) to check
for size.xl and append the corresponding xl class name (consistent with the
existing pattern for xs/sm/md/lg), ensuring the xl value is included when
building the element's className.
In `@src/App/frontend/src/layout/Datepicker/DatepickerComponent.test.tsx`:
- Around line 13-17: Create a manual mock for the external module
'`@app/form-component`' under src/__mocks__/ that exports __esModule: true and a
mocked getDateFormat (jest.fn(() => 'dd.MM.yyyy')) matching the shape used in
DatepickerComponent.test.tsx; then remove the inline jest.mock block from
DatepickerComponent.test.tsx and instead ensure the test calls
jest.mock('`@app/form-component`') (or relies on Jest's automatic manual mock
resolution) so the shared mock in src/__mocks__ is used across the frontend test
suite.
🪄 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: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
Run ID: 56edb378-cf38-4f39-a2b5-9b194f8b3953
⛔ Files ignored due to path filters (1)
yarn.lockis excluded by!**/yarn.lock,!**/*.lock
📒 Files selected for processing (85)
libs/form-component/package.jsonlibs/form-component/src/app-components/Button/Button.tsxlibs/form-component/src/app-components/Datepicker/Calendar.module.csslibs/form-component/src/app-components/Datepicker/DatePickerCalendar.tsxlibs/form-component/src/app-components/Datepicker/DatePickerInput.tsxlibs/form-component/src/app-components/Datepicker/Datepicker.stories.tsxlibs/form-component/src/app-components/Datepicker/Datepicker.tsxlibs/form-component/src/app-components/Datepicker/DatepickerDialog.tsxlibs/form-component/src/app-components/Datepicker/index.tslibs/form-component/src/app-components/Datepicker/utils/dateHelpers.test.tslibs/form-component/src/app-components/Datepicker/utils/dateHelpers.tslibs/form-component/src/app-components/Datepicker/utils/dateLocales.tslibs/form-component/src/app-components/Flex/Flex.module.csslibs/form-component/src/app-components/Flex/Flex.tsxlibs/form-component/src/app-components/Flex/index.tslibs/form-component/src/app-components/Input/FormattedInput.tsxlibs/form-component/src/app-components/Input/Input.module.csslibs/form-component/src/app-components/Input/Input.stories.tsxlibs/form-component/src/app-components/Input/Input.test.tsxlibs/form-component/src/app-components/Input/Input.tsxlibs/form-component/src/app-components/Input/NumericInput.tsxlibs/form-component/src/app-components/Input/constants.tslibs/form-component/src/app-components/Input/index.tslibs/form-component/src/app-components/hooks/index.tslibs/form-component/src/app-components/hooks/useDeviceWidths.tslibs/form-component/src/app-components/index.tssrc/App/frontend/monorepo-changed-paths.txtsrc/App/frontend/src/app-components/DynamicForm/DynamicForm.tsxsrc/App/frontend/src/app-components/Input/FormattedInput.tsxsrc/App/frontend/src/app-components/Input/NumericInput.tsxsrc/App/frontend/src/app-components/Label/Fieldset.tsxsrc/App/frontend/src/app-components/Label/Label.tsxsrc/App/frontend/src/app-components/Pagination/Pagination.tsxsrc/App/frontend/src/app-components/Panel/Panel.tsxsrc/App/frontend/src/components/AltinnCollapsible.tsxsrc/App/frontend/src/components/altinnParty.tsxsrc/App/frontend/src/components/form/Form.tsxsrc/App/frontend/src/components/label/Label.tsxsrc/App/frontend/src/components/message/ErrorReport.tsxsrc/App/frontend/src/components/molecules/AltinnSubstatus.tsxsrc/App/frontend/src/components/presentation/Header.tsxsrc/App/frontend/src/components/presentation/Presentation.tsxsrc/App/frontend/src/components/wrappers/ProcessWrapper.tsxsrc/App/frontend/src/features/devtools/components/DevToolsLogs/DevToolsLogs.tsxsrc/App/frontend/src/features/instantiate/containers/InstantiationErrorPage.tsxsrc/App/frontend/src/features/instantiate/containers/PartySelection.tsxsrc/App/frontend/src/features/pdf/PdfFromLayout.tsxsrc/App/frontend/src/features/receipt/ReceiptContainer.tsxsrc/App/frontend/src/layout/Accordion/Accordion.tsxsrc/App/frontend/src/layout/Address/AddressComponent.tsxsrc/App/frontend/src/layout/ButtonGroup/ButtonGroupComponent.tsxsrc/App/frontend/src/layout/Cards/Cards.tsxsrc/App/frontend/src/layout/Checkboxes/MultipleChoiceSummary.tsxsrc/App/frontend/src/layout/ComponentStructureWrapper.tsxsrc/App/frontend/src/layout/Datepicker/DatepickerComponent.test.tsxsrc/App/frontend/src/layout/Datepicker/DatepickerComponent.tsxsrc/App/frontend/src/layout/Datepicker/DropdownCaption.module.csssrc/App/frontend/src/layout/Datepicker/DropdownCaption.tsxsrc/App/frontend/src/layout/Datepicker/index.tsxsrc/App/frontend/src/layout/Datepicker/useDatepickerValidation.tssrc/App/frontend/src/layout/FileUploadWithTag/EditWindowComponent.tsxsrc/App/frontend/src/layout/GenericComponent.tsxsrc/App/frontend/src/layout/Group/GroupSummary.tsxsrc/App/frontend/src/layout/Image/ImageComponent.tsxsrc/App/frontend/src/layout/Input/InputComponent.tsxsrc/App/frontend/src/layout/Input/config.tssrc/App/frontend/src/layout/InstanceInformation/InstanceInformationComponent.tsxsrc/App/frontend/src/layout/NavigationBar/NavigationBarComponent.tsxsrc/App/frontend/src/layout/OrganisationLookup/OrganisationLookupComponent.tsxsrc/App/frontend/src/layout/PersonLookup/PersonLookupComponent.tsxsrc/App/frontend/src/layout/RepeatingGroup/Container/RepeatingGroupContainer.tsxsrc/App/frontend/src/layout/RepeatingGroup/EditContainer/RepeatingGroupsEditContainer.tsxsrc/App/frontend/src/layout/RepeatingGroup/Summary2/RepeatingGroupSummary.tsxsrc/App/frontend/src/layout/RepeatingGroup/Table/RepeatingGroupTableRow.tsxsrc/App/frontend/src/layout/Subform/SubformComponent.tsxsrc/App/frontend/src/layout/Subform/Summary/SubformSummaryComponent2.tsxsrc/App/frontend/src/layout/Subform/Summary/SubformSummaryTable.tsxsrc/App/frontend/src/layout/Summary/SummaryComponent.tsxsrc/App/frontend/src/layout/Summary2/CommonSummaryComponents/LayoutSetSummaryAccordion.tsxsrc/App/frontend/src/layout/Summary2/SummaryComponent2/ComponentSummary.tsxsrc/App/frontend/src/layout/Summary2/SummaryComponent2/PageSummary.tsxsrc/App/frontend/src/layout/Tabs/Tabs.tsxsrc/App/frontend/src/layout/Tabs/TabsSummary.tsxsrc/App/frontend/src/layout/TimePicker/TimePickerComponent.tsxsrc/App/frontend/src/utils/dateUtils.test.ts
💤 Files with no reviewable changes (2)
- src/App/frontend/src/app-components/Input/FormattedInput.tsx
- src/App/frontend/src/app-components/Input/NumericInput.tsx
phlipsterit
reviewed
May 18, 2026
phlipsterit
approved these changes
May 20, 2026
…n/altinn-studio into refactor/move-Input-to-app
This was referenced May 20, 2026
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Issue: #18817
Description
Moves the
Inputapp-component (Input,FormattedInput,NumericInput,constants, styles) fromsrc/App/frontend/src/app-components/Inputinto the@app/form-componentlibrary.Frontend consumers import from
@app/form-component.Added unit tests and a Storybook story.
Verification
Summary by CodeRabbit
New Features
Refactor
Documentation
Tests