Fixes: #7216
The issue was caused by the ```min-width``` property of
```StyledEditableCellEditModeContainer```. So, I removed it.
Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>
Closes: #8647Closes: #8649
**Changes & Why**
1. Added a Search Input to `SettingsDataModelFieldAddressForm` &
`SettingsDataModelFieldCurrencyForm` as `Select` component already
accepts it as a prop.
2. Gave a fixed width to the dropdown of both the above components to
ensure it doesn't shrink on search for the menu items with low word
count.
3. Added countries Flag to `SettingsDataModelFieldAddressForm`.
4. Replaced `MenuItem` with `MenuItemSelect` to get the desired
highlighted background for the selected item with `IconCheck` to
differentiate the current selected item. This is useful across all the
select components throughout the app.
5. I realized that in some components we might not need IconCheck and
only need a highlighted background for the selected item. For ex:
`SettingsDataModelFieldBooleanForm` . Therefore, I created a prop
`needIconCheck` with default as true so it doesn't break the existing
`MenuItemSelect` and we can pass that prop as false wherever needed.
[Screencast from 2024-12-21
12-08-08.webm](https://github.com/user-attachments/assets/4f8070a8-f339-4556-a137-bbbad58b171c)
Closes: #8549
It was quite complex to get this right. So, I went through Notion's
website to see how they implemented it.
Instead of using `display: none` or having a space reserved for the
Icon, I used clip-path & opacity trick to achieve the desired behaviour.
This maintains accessibility and helps in label or ObjectName to take
the full space.
Also, truncation now works for label & objectName as a whole instead of
separately, as seen in my previous PR.
**Caveats**
The only problem that now remains is not having
`NavigationDrawerAnimatedCollapseWrapper`. Having it on top of any text
or div won't let the flex or truncation property work.
[Screencast from 2024-11-28
13-37-31.webm](https://github.com/user-attachments/assets/29255cd2-3f15-4b1d-b1e1-c041c70052e5)
---------
Co-authored-by: ehconitin <nitinkoche03@gmail.com>
Co-authored-by: martmull <martmull@hotmail.fr>
Fixes: #7460
**Changes & Why**
Since all the settings pages lie in the Outlet of DefaultLayout, there
was no way to handle it apart from creating a separate errorFallback for
the settings route.
So, I created a settingsErrorFallback component that uses the same
styling of settings pages.
Created ErrorBoundaryWrapper that checks if its settings route then show
SettingsErrorFallback else show GenericErrorFallback.
Now, for the breadcrumb part. I found that all the settings pages use
hardcoded title. So, I created generateBreadcrumbLinks function that
will provide different title and links based on how it's respective
settings page has them.
If this approach looks fine, I will add the other remaining titles and
links to the generateBreadcrumbLinks function and move that whole
function to its separate file. And will fix linting errors.
If there is any different approach to handle it, lemme know. I'm happy
to implement it.
Fixes: #6105
### Problem
- The dropdown gets clipped when the number of filters increases.
### Solution
- Added scroll property to the ```DropdownMenu```
- Added size middleware to the floating UI hook.
- Provided padding of 20px to the size middleware, so that it maintains
distance from the bottom of the screen.
[Screencast from 2024-10-25
13-47-04.webm](https://github.com/user-attachments/assets/c2315ee2-6092-4c4a-8126-dba7ac3bf49b)
---------
Co-authored-by: martmull <martmull@hotmail.fr>
Fixes: #7959
### Problem
- When searching in the dropdown, the results list would shrink based on
matching items
- This dynamic height change caused the dropdown to flip its position on
each keystroke
### Solution
- Added ```hasMinHeight``` as optional props to the
```DropdownMenuItemsContainer``` to maintain consistent height
- This prevents unwanted position recalculations and flipping while user
types
- The dropdown now stays in its initial position throughout the search
interaction
[Screencast from 2024-10-24
15-43-03.webm](https://github.com/user-attachments/assets/741317b7-fc5e-4874-8221-aa626a1a1747)
Fixes: #7897
This PR fixes the flipping of the date-picker in the record's cell even
if there is enough space below the table.
I attached a screencast to show that it's working fine now.
With this, it only flips when there is less space to accommodate the
date-picker comp. Also, I tested this after adding lots of records to
see if the scrolling behaviour is intact or not. And I found no issues,
it's working as expected.
[Screencast from 2024-10-21
13-39-42.webm](https://github.com/user-attachments/assets/615fac80-ae2e-4d26-8f94-55d7ee3f91c2)
Harsh Singh