diff --git a/packages/twenty-front/src/modules/ui/input/components/IconPicker.tsx b/packages/twenty-front/src/modules/ui/input/components/IconPicker.tsx
index f1f7cff90..b0e8278b8 100644
--- a/packages/twenty-front/src/modules/ui/input/components/IconPicker.tsx
+++ b/packages/twenty-front/src/modules/ui/input/components/IconPicker.tsx
@@ -1,5 +1,5 @@
-import { useMemo, useState } from 'react';
import styled from '@emotion/styled';
+import { useMemo, useState } from 'react';
import { useRecoilValue } from 'recoil';
import { IconApps, IconComponent, useIcons } from 'twenty-ui';
@@ -147,6 +147,8 @@ export const IconPicker = ({
[matchingSearchIconKeys],
);
+ const icon = selectedIconKey ? getIcon(selectedIconKey) : IconApps;
+
return (
}
diff --git a/packages/twenty-front/src/modules/views/view-picker/components/ViewPickerContentCreateMode.tsx b/packages/twenty-front/src/modules/views/view-picker/components/ViewPickerContentCreateMode.tsx
index 1d4fad308..c3ce24018 100644
--- a/packages/twenty-front/src/modules/views/view-picker/components/ViewPickerContentCreateMode.tsx
+++ b/packages/twenty-front/src/modules/views/view-picker/components/ViewPickerContentCreateMode.tsx
@@ -30,6 +30,7 @@ import { viewPickerIsPersistingComponentState } from '@/views/view-picker/states
import { viewPickerKanbanFieldMetadataIdComponentState } from '@/views/view-picker/states/viewPickerKanbanFieldMetadataIdComponentState';
import { viewPickerSelectedIconComponentState } from '@/views/view-picker/states/viewPickerSelectedIconComponentState';
import { viewPickerTypeComponentState } from '@/views/view-picker/states/viewPickerTypeComponentState';
+import { useState } from 'react';
const StyledNoKanbanFieldAvailableContainer = styled.div`
color: ${({ theme }) => theme.font.color.light};
@@ -41,6 +42,7 @@ const StyledNoKanbanFieldAvailableContainer = styled.div`
export const ViewPickerContentCreateMode = () => {
const { setViewPickerMode } = useViewPickerMode();
+ const [hasManuallySelectedIcon, setHasManuallySelectedIcon] = useState(false);
const [viewPickerInputName, setViewPickerInputName] =
useRecoilComponentStateV2(viewPickerInputNameComponentState);
@@ -87,9 +89,17 @@ export const ViewPickerContentCreateMode = () => {
ViewsHotkeyScope.ListDropdown,
);
+ const defaultIcon =
+ viewPickerType === ViewType.Kanban ? 'IconLayoutKanban' : 'IconTable';
+
+ const selectedIcon = hasManuallySelectedIcon
+ ? viewPickerSelectedIcon
+ : defaultIcon;
+
const onIconChange = ({ iconKey }: { iconKey: string }) => {
setViewPickerIsDirty(true);
setViewPickerSelectedIcon(iconKey);
+ setHasManuallySelectedIcon(true);
};
const handleClose = async () => {
@@ -106,7 +116,7 @@ export const ViewPickerContentCreateMode = () => {
setHotkeyScope(ViewsHotkeyScope.ListDropdown)}
/>
diff --git a/packages/twenty-ui/src/display/icon/hooks/useIcons.ts b/packages/twenty-ui/src/display/icon/hooks/useIcons.ts
index c07d0a38a..981fae839 100644
--- a/packages/twenty-ui/src/display/icon/hooks/useIcons.ts
+++ b/packages/twenty-ui/src/display/icon/hooks/useIcons.ts
@@ -12,7 +12,10 @@ export const useIcons = () => {
};
const getIcon = (iconKey?: string | null) => {
- if (!iconKey) return defaultIcon;
+ if (!iconKey) {
+ return defaultIcon;
+ }
+
return icons[iconKey] ?? defaultIcon;
};