Updated numeric type to disable input and use only buttons and made date and time fields clickable #67
Conversation
…ate and time fields clickable
WalkthroughThe recent updates across the React project focus on enhancing the user experience by modifying numeric input fields to use buttons instead of direct input, and improving the interaction with date and time fields. Additionally, new configuration options and CSS styles have been introduced to support these changes, alongside updates to storybook examples to reflect the new functionalities. Changes
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (invoked as PR comments)
Additionally, you can add CodeRabbit Configration File (
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 0
Outside diff range and nitpick comments (3)
react/css/README.md (1)
Line range hint
41-92: Correct formatting issues for better readability and adherence to markdown best practices.- ## Published from DIGIT Core - Digit Core Repo (https://github.com/egovernments/Digit-Core/tree/digit-ui-core) + ## Published from DIGIT Core + + Digit Core Repo (https://github.com/egovernments/Digit-Core/tree/digit-ui-core) +react/ui-components/README.md (1)
Line range hint
42-116: Correct formatting issues for better readability and adherence to markdown best practices.- # Local Development - Use Node 14 version + # Local Development + + Use Node 14 version +react/ui-components/src/atoms/TextInput.js (1)
Line range hint
295-395: The update to directly open the date or time picker aligns with the PR objectives. Consider improving error handling by providing user feedback or logging more details.- console.error("Error opening picker:", error); + console.error("Error opening picker. Details:", error.message);
Review Details
Configuration used: CodeRabbit UI
Review profile: CHILL
Files ignored due to path filters (9)
react/css/package.jsonis excluded by!**/*.jsonreact/example/package.jsonis excluded by!**/*.jsonreact/modules/Project/package.jsonis excluded by!**/*.jsonreact/modules/core/package.jsonis excluded by!**/*.jsonreact/modules/sample/package.jsonis excluded by!**/*.jsonreact/package.jsonis excluded by!**/*.jsonreact/ui-components/package.jsonis excluded by!**/*.jsonreact/ui-components/yarn-error.logis excluded by!**/*.log,!**/*.logreact/yarn-error.logis excluded by!**/*.log,!**/*.log
Files selected for processing (7)
- react/css/README.md (1 hunks)
- react/css/src/digitv2/components/textInputV2.scss (1 hunks)
- react/example/public/index.html (1 hunks)
- react/modules/sample/src/configs/SampleConfig.js (1 hunks)
- react/ui-components/README.md (1 hunks)
- react/ui-components/src/atoms/TextInput.js (4 hunks)
- react/ui-components/src/hoc/stories/InputFields.stories.js (1 hunks)
Files skipped from review due to trivial changes (3)
- react/css/src/digitv2/components/textInputV2.scss
- react/example/public/index.html
- react/ui-components/src/hoc/stories/InputFields.stories.js
Additional Context Used
LanguageTool (2)
react/css/README.md (1)
Near line 87: This phrase is duplicated. You should probably use “DIGIT Core” only once.
Context: ...ishnakole-wtt-egov] ## Published from DIGIT Core Digit Core Repo (https://github.com/egovernments/D...react/ui-components/README.md (1)
Near line 18: A comma might be missing here.
Context: ...ssion's ``` ## Usage After adding the dependency make sure you have this dependency in ...
Additional comments not posted (3)
react/css/README.md (1)
45-45: Changelog update is accurate and aligns with the PR objectives.react/ui-components/README.md (1)
61-61: Changelog update is accurate and aligns with the PR objectives.react/modules/sample/src/configs/SampleConfig.js (1)
448-454: The new configuration for disabling text fields in numeric inputs looks well-integrated and follows the existing configuration structure.Verification successful
The
disableTextFieldconfiguration is referenced in the following files:
react/ui-components/src/hoc/stories/InputFields.stories.jsreact/ui-components/src/atoms/TextInput.jsreact/modules/sample/src/configs/SampleConfig.jsTo ensure the correct implementation and functionality, let's review the specific lines in
InputFields.stories.jsandTextInput.js.
The
disableTextFieldconfiguration is correctly referenced and utilized in the following files:
react/ui-components/src/hoc/stories/InputFields.stories.js: Used in a storybook configuration.react/ui-components/src/atoms/TextInput.js: Used to conditionally apply thenumeric-buttons-onlyclass, affecting the UI rendering.These references confirm that the
disableTextFieldconfiguration is integrated and functioning as intended.Scripts Executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # Description: Verify that the new configuration `disableTextField` is being utilized in the UI components. # Test: Search for the usage of `disableTextField` in the project. Expect: References in component files. rg --type js 'disableTextField'Length of output: 506
Script:
#!/bin/bash # Display the specific lines where `disableTextField` is referenced in `InputFields.stories.js` and `TextInput.js`. # Extract lines from `InputFields.stories.js` rg --type js --context 5 'disableTextField' react/ui-components/src/hoc/stories/InputFields.stories.js # Extract lines from `TextInput.js` rg --type js --context 5 'disableTextField' react/ui-components/src/atoms/TextInput.jsLength of output: 991
No description provided.