Skip to content

Commit 3294431

Browse files
author
MargeBot
committed
Merge branch 'fix/lumo-icon-replacement-again-again-again-no-idea-for-branch-name' into 'main'
fix: Some Icon replacement for Lumo See merge request web/clients!25608
2 parents 6110c3a + 9938cef commit 3294431

6 files changed

Lines changed: 39 additions & 42 deletions

File tree

applications/lumo/src/app/components/Files/KnowledgeBase/KnowledgeBasePanel.tsx

Lines changed: 14 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,10 @@ import { clsx } from 'clsx';
44
import { c } from 'ttag';
55

66
import { Button } from '@proton/atoms/Button/Button';
7-
import { Icon, useNotifications } from '@proton/components';
7+
import { useNotifications } from '@proton/components';
88
import { IcBrandProtonDrive } from '@proton/icons/icons/IcBrandProtonDrive';
9+
import { IcChevronDown } from '@proton/icons/icons/IcChevronDown';
10+
import { IcChevronUp } from '@proton/icons/icons/IcChevronUp';
911
import { IcCross } from '@proton/icons/icons/IcCross';
1012
import { IcFile } from '@proton/icons/icons/IcFile';
1113
import { IcInfoCircle } from '@proton/icons/icons/IcInfoCircle';
@@ -468,6 +470,8 @@ export const KnowledgeBasePanel = ({
468470
autoRetrievedAttachments.length === 0 &&
469471
!linkedDriveFolder;
470472

473+
const IndicatorIcon = showKnowledgeExplanation ? IcChevronUp : IcChevronDown;
474+
471475
return (
472476
<>
473477
<div className={panelClassName} ref={filesContainerRef}>
@@ -543,14 +547,14 @@ export const KnowledgeBasePanel = ({
543547
/>
544548
)}
545549

546-
<ManualAttachmentsSection
547-
currentAttachments={currentAttachments}
548-
activeHistoricalFiles={activeHistoricalFiles}
549-
onView={handleFileClick}
550-
onViewFile={onViewFile}
551-
onRemove={(id) => dispatch(locallyDeleteAttachmentFromLocalRequest(id))}
552-
onExclude={handleExcludeHistoricalFile}
553-
/>
550+
<ManualAttachmentsSection
551+
currentAttachments={currentAttachments}
552+
activeHistoricalFiles={activeHistoricalFiles}
553+
onView={handleFileClick}
554+
onViewFile={onViewFile}
555+
onRemove={(id) => dispatch(locallyDeleteAttachmentFromLocalRequest(id))}
556+
onExclude={handleExcludeHistoricalFile}
557+
/>
554558

555559
<ExcludedFilesSection
556560
excludedAutoRetrieved={excludedAutoRetrieved}
@@ -576,7 +580,6 @@ export const KnowledgeBasePanel = ({
576580
className="shrink-0 mt-2 border border-weak rounded-lg overflow-hidden"
577581
style={{ height: showKnowledgeExplanation ? '8.75rem' : '5rem' }}
578582
>
579-
{/* eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions */}
580583
<button
581584
type="button"
582585
className="flex flex-row items-center gap-2 cursor-pointer p-3"
@@ -586,11 +589,7 @@ export const KnowledgeBasePanel = ({
586589
<h4 className="m-0 text-sm text-bold flex-1">
587590
{c('collider_2025: Info').t`File capacity for this conversation`}
588591
</h4>
589-
<Icon
590-
name={showKnowledgeExplanation ? 'chevron-up' : 'chevron-down'}
591-
size={4}
592-
className="color-weak shrink-0"
593-
/>
592+
<IndicatorIcon size={4} className="color-weak shrink-0" />
594593
</button>
595594

596595
{showKnowledgeExplanation && (

applications/lumo/src/app/components/Modals/SettingsModal/SearchIndex/SearchInspectDetail.tsx

Lines changed: 5 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,13 @@
1-
import { useState } from 'react';
21
import type { FunctionComponent } from 'react';
2+
import { useState } from 'react';
33

44
import { c } from 'ttag';
55

66
import { Button } from '@proton/atoms/Button/Button';
77
import FileIcon from '@proton/components/components/fileIcon/FileIcon';
8-
import { Icon } from '@proton/components/index';
98
import { IcArrowLeft } from '@proton/icons/icons/IcArrowLeft';
9+
import { IcChevronDown } from '@proton/icons/icons/IcChevronDown';
10+
import { IcChevronRight } from '@proton/icons/icons/IcChevronRight';
1011

1112
import type { GroupedDocument } from './SearchInspectList';
1213

@@ -67,6 +68,7 @@ export const SearchInspectDetail: FunctionComponent<Props> = ({ grouped, formatB
6768
{chunks.map((chunk, index) => {
6869
const isExpanded = expandedChunk === index;
6970
const chunkSize = chunk.content ? new TextEncoder().encode(chunk.content).byteLength : 0;
71+
const IndicatorIcon = isExpanded ? IcChevronDown : IcChevronRight;
7072

7173
return (
7274
<div
@@ -79,11 +81,7 @@ export const SearchInspectDetail: FunctionComponent<Props> = ({ grouped, formatB
7981
className="w-full p-3 text-left flex items-center gap-3 hover:bg-norm transition-colors"
8082
onClick={() => setExpandedChunk(isExpanded ? null : index)}
8183
>
82-
<Icon
83-
name={isExpanded ? 'chevron-down' : 'chevron-right'}
84-
size={4}
85-
className="color-weak shrink-0"
86-
/>
84+
<IndicatorIcon size={4} className="color-weak shrink-0" />
8785
<div className="flex-1 min-w-0">
8886
<div className="flex items-center gap-2">
8987
<span className="text-sm text-semibold">

applications/lumo/src/app/features/agents/AgentModal.tsx

Lines changed: 4 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,6 @@ import { c } from 'ttag';
44

55
import { Button } from '@proton/atoms/Button/Button';
66
import {
7-
Icon,
87
InputFieldTwo,
98
ModalTwo,
109
ModalTwoContent,
@@ -14,6 +13,7 @@ import {
1413
Toggle,
1514
} from '@proton/components';
1615
import type { ModalStateProps } from '@proton/components';
16+
import { IcCross } from '@proton/icons/icons/IcCross';
1717
import { LUMO_SHORT_APP_NAME } from '@proton/shared/lib/constants';
1818

1919
import { useCustomAgents } from '../../hooks/useCustomAgents';
@@ -55,14 +55,11 @@ export const AgentModal = ({ agentId, onAgentCreated, ...modalProps }: AgentModa
5555
setHidden(!!existing?.hidden);
5656
setConversationStarters(existing?.conversationStarters ?? []);
5757
}
58-
// eslint-disable-next-line react-hooks/exhaustive-deps
5958
}, [modalProps.open, agentId]);
6059

6160
// Always render one trailing empty field so there's a row to type into, up to the max.
6261
const starterFields =
63-
conversationStarters.length < MAX_CONVERSATION_STARTERS
64-
? [...conversationStarters, '']
65-
: conversationStarters;
62+
conversationStarters.length < MAX_CONVERSATION_STARTERS ? [...conversationStarters, ''] : conversationStarters;
6663

6764
const handleStarterChange = (index: number, value: string) => {
6865
setConversationStarters((prev) => {
@@ -104,9 +101,7 @@ export const AgentModal = ({ agentId, onAgentCreated, ...modalProps }: AgentModa
104101
};
105102

106103
const isSaveDisabled = !name.trim();
107-
const title = existing
108-
? c('collider_2025:Title').t`Edit agent`
109-
: c('collider_2025:Title').t`Create agent`;
104+
const title = existing ? c('collider_2025:Title').t`Edit agent` : c('collider_2025:Title').t`Create agent`;
110105

111106
return (
112107
<ModalTwo {...modalProps} onClose={handleClose} size="large">
@@ -195,7 +190,7 @@ export const AgentModal = ({ agentId, onAgentCreated, ...modalProps }: AgentModa
195190
title={c('collider_2025:Action').t`Remove`}
196191
aria-label={c('collider_2025:Action').t`Remove`}
197192
>
198-
<Icon name="cross" size={4} />
193+
<IcCross size={4} />
199194
</Button>
200195
</div>
201196
);

applications/lumo/src/app/features/agents/AgentPickerModal.tsx

Lines changed: 11 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
import { useMemo, useState } from 'react';
22

3+
import { clsx } from 'clsx';
34
import { c } from 'ttag';
45

56
import { Button } from '@proton/atoms/Button/Button';
@@ -11,7 +12,11 @@ import {
1112
ModalTwoHeader,
1213
useModalStateObject,
1314
} from '@proton/components';
14-
import { clsx } from 'clsx';
15+
import { IcCheckmark } from '@proton/icons/icons/IcCheckmark';
16+
import { IcPen } from '@proton/icons/icons/IcPen';
17+
import { IcPlus } from '@proton/icons/icons/IcPlus';
18+
import { IcSquares } from '@proton/icons/icons/IcSquares';
19+
import { BRAND_NAME } from '@proton/shared/lib/constants';
1520

1621
import { useConversationAgent } from '../../hooks/useConversationAgent';
1722
import { useCustomAgents } from '../../hooks/useCustomAgents';
@@ -21,7 +26,6 @@ import type { CustomAgent } from '../../redux/slices/lumoUserSettings';
2126
import { AgentModal } from './AgentModal';
2227
import { DEFAULT_AGENT_ICON } from './constants';
2328
import { getAgentByline, isAgentEditable } from './registry';
24-
import {BRAND_NAME} from "@proton/shared/lib/constants";
2529

2630
interface AgentPickerModalProps {
2731
/** Current conversation id, if a conversation already exists. */
@@ -74,6 +78,7 @@ export const AgentPickerModal = ({ conversationId }: AgentPickerModalProps) => {
7478

7579
const filteredAgents = useMemo(() => {
7680
const byFilter: CustomAgent[] =
81+
// eslint-disable-next-line no-nested-ternary
7782
filter === 'mine'
7883
? personalAgents
7984
: filter === 'default'
@@ -188,9 +193,7 @@ export const AgentPickerModal = ({ conversationId }: AgentPickerModalProps) => {
188193
className="flex items-center justify-center shrink-0 w-custom"
189194
style={{ '--w-custom': '1.5rem' } as React.CSSProperties}
190195
>
191-
{isActive && (
192-
<Icon name="checkmark" size={4} className="color-primary" />
193-
)}
196+
{isActive && <IcCheckmark size={4} className="color-primary" />}
194197
</span>
195198
{editable ? (
196199
<Button
@@ -201,7 +204,7 @@ export const AgentPickerModal = ({ conversationId }: AgentPickerModalProps) => {
201204
title={c('collider_2025:Action').t`Edit agent`}
202205
aria-label={c('collider_2025:Action').t`Edit agent`}
203206
>
204-
<Icon name="pen" size={4} />
207+
<IcPen size={4} />
205208
</Button>
206209
) : (
207210
<Button
@@ -212,7 +215,7 @@ export const AgentPickerModal = ({ conversationId }: AgentPickerModalProps) => {
212215
title={c('collider_2025:Action').t`Make a copy`}
213216
aria-label={c('collider_2025:Action').t`Make a copy`}
214217
>
215-
<Icon name="squares" size={4} />
218+
<IcSquares size={4} />
216219
</Button>
217220
)}
218221
</div>
@@ -228,7 +231,7 @@ export const AgentPickerModal = ({ conversationId }: AgentPickerModalProps) => {
228231
className="flex items-center justify-center gap-2 mb-2"
229232
onClick={() => openEditor(undefined)}
230233
>
231-
<Icon name="plus" size={4} />
234+
<IcPlus size={4} />
232235
{c('collider_2025:Action').t`New agent`}
233236
</Button>
234237
</ModalTwoContent>

applications/lumo/src/app/features/agents/ComposerAgentBar.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import { c } from 'ttag';
22

33
import { Icon } from '@proton/components';
4+
import { IcCross } from '@proton/icons/icons/IcCross';
45

56
import { useConversationAgent } from '../../hooks/useConversationAgent';
67
import { useLumoDispatch } from '../../redux/hooks';
@@ -48,7 +49,7 @@ export const ComposerAgentBar = ({ conversationId }: ComposerAgentBarProps) => {
4849
aria-label={c('collider_2025:Action').t`Remove agent`}
4950
title={c('collider_2025:Action').t`Remove agent`}
5051
>
51-
<Icon name="cross" size={3} />
52+
<IcCross size={3} />
5253
</button>
5354
</span>
5455
<button

applications/lumo/src/app/features/imageActions/ImagePreviewOverlay.tsx

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,9 @@ import { createPortal } from 'react-dom';
33

44
import { c } from 'ttag';
55

6-
import { Icon } from '@proton/components';
76
import { IcArrowDownLine } from '@proton/icons/icons/IcArrowDownLine';
7+
import { IcArrowLeft } from '@proton/icons/icons/IcArrowLeft';
8+
import { IcCross } from '@proton/icons/icons/IcCross';
89

910
import { SketchCanvas } from '../drawingcanvas/SketchCanvas';
1011
import type { DrawingMode } from '../drawingcanvas/types';
@@ -143,7 +144,7 @@ export const ImagePreviewOverlay = ({
143144
onClick={mode === 'edit' ? () => setMode('preview') : onClose}
144145
title={mode === 'edit' ? c('collider_2025:Action').t`Back` : c('collider_2025:Action').t`Close`}
145146
>
146-
<Icon name={mode === 'edit' ? 'arrow-left' : 'cross'} size={4} />
147+
{mode === 'edit' ? <IcArrowLeft size={4} /> : <IcCross size={4} />}
147148
</button>
148149
</div>
149150

0 commit comments

Comments
 (0)