Skip to content

Commit 1c1b506

Browse files
SandraMonnierSandraMonnier
committed
Merge remote-tracking branch 'origin/dev' into dev
2 parents 30d1cab + 655d197 commit 1c1b506

32 files changed

+835
-665
lines changed

‎colab-webapp/src/main/node/app/src/components/cards/CardEditor.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ import Flex from '../common/layout/Flex';
2121
import { Item, SideCollapsibleCtx } from '../common/layout/SideCollapsibleContext';
2222
import { TextEditorContext } from '../documents/texteditor/TextEditorContext';
2323
import { ResourcesMainViewHeader, ResourcesMainViewPanel } from '../resources/ResourcesMainView';
24-
import CardAssignmentsPanel from '../team/CardAssignments';
24+
import CardAssignmentsPanel from '../team/CardAssignmentsTable';
2525
import CardEditorDeliverable from './CardEditorDeliverable';
2626
import CardEditorHeader from './CardEditorHeader';
2727
import CardEditorSideMenu from './CardEditorSideMenu';

‎colab-webapp/src/main/node/app/src/components/cards/CardRootView.tsx‎

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ import { css } from '@emotion/css';
99
import { CardContent } from 'colab-rest-client';
1010
import * as React from 'react';
1111
import { useAndLoadSubCards } from '../../store/selectors/cardSelector';
12-
import { space_sm } from '../../styling/style';
12+
import { space_lg, space_sm, space_xs } from '../../styling/style';
1313
import InlineLoading from '../common/element/InlineLoading';
1414
import Flex from '../common/layout/Flex';
1515
import { PresenceContext } from '../presence/PresenceContext';
@@ -43,7 +43,11 @@ export default function RootView({ rootContent }: { rootContent: CardContent | n
4343
})}
4444
>
4545
<Dndwrapper cards={subCards}>
46-
<ProjectBreadcrumbs />
46+
<ProjectBreadcrumbs
47+
className={css({
48+
padding: space_xs + ' ' + space_xs + ' ' + space_xs + ' ' + space_lg,
49+
})}
50+
/>
4751
{rootContent != null && rootContent.id != null ? (
4852
<Flex className={css({ overflow: 'hidden' })} justify="center" direction="row" grow={1}>
4953
<Flex

‎colab-webapp/src/main/node/app/src/components/cards/CardThumb.tsx‎

Lines changed: 22 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -59,6 +59,15 @@ const cardThumbContentStyle = (depth?: number) => {
5959
}
6060
};
6161

62+
// TODO : show only when hovering THE card
63+
const onHoverStyle = css({
64+
'&:hover': {
65+
'.visibleOnHover ': {
66+
visibility: 'visible',
67+
},
68+
},
69+
});
70+
6271
// export interface TinyCardProps {
6372
// card: Card;
6473
// width?: string;
@@ -174,7 +183,11 @@ export default function CardThumb({
174183
coveringColor={coveringColor}
175184
showBorder={depth !== 2}
176185
>
177-
<Flex grow="1" align="stretch" className={css({ overflow: 'hidden' })}>
186+
<Flex
187+
grow="1"
188+
align="stretch"
189+
className={cx(onHoverStyle, css({ overflow: 'hidden' }))}
190+
>
178191
{mayOrganize && variant && (
179192
<CardCreatorAndOrganize
180193
rootContent={variant}
@@ -218,17 +231,14 @@ export default function CardThumb({
218231
<Flex
219232
// align="stretch"
220233
// justify="stretch"
221-
className={cx(
222-
'FlexItem',
223-
css({ flexGrow: 1 }),
224-
)}
234+
className={cx('FlexItem', css({ flexGrow: 1 }))}
225235
>
226-
{card.deletionStatus != null &&
236+
{card.deletionStatus != null && (
227237
<Flex className={css({ margin: '0 ' + space_sm, flexShrink: 0 })}>
228238
{/* It should not be displayed if deleted. But whenever there is a bug, it is obvious */}
229239
<DeletionStatusIndicator status={card.deletionStatus} size="sm" />
230240
</Flex>
231-
}
241+
)}
232242
{depth === 1 ? (
233243
<DiscreetInput
234244
value={card.title || ''}
@@ -268,8 +278,7 @@ export default function CardThumb({
268278
margin: '2px 2px 6px 2px',
269279
}),
270280
)}
271-
containerClassName={
272-
css({ flexGrow: 1 })}
281+
containerClassName={css({ flexGrow: 1 })}
273282
autoWidth={false}
274283
rows={2}
275284
/>
@@ -310,7 +319,10 @@ export default function CardThumb({
310319
<DropDownMenu
311320
icon={'more_vert'}
312321
valueComp={{ value: '', label: '' }}
313-
buttonClassName={cx(lightIconButtonStyle)}
322+
buttonClassName={
323+
'visibleOnHover ' +
324+
cx(lightIconButtonStyle, css({ visibility: 'hidden' }))
325+
}
314326
className={css({ alignSelf: depth === 0 ? 'flex-start' : 'center' })}
315327
entries={[
316328
{

‎colab-webapp/src/main/node/app/src/components/cards/ProgressBar.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ import { debounce } from 'lodash';
1212
import * as React from 'react';
1313
import * as API from '../../API/api';
1414
import { useAppDispatch } from '../../store/hooks';
15-
import { space_lg } from '../../styling/style';
15+
import { space_md, space_sm } from '../../styling/style';
1616
import { cardColors, lightColor, vividColor } from '../../styling/theme';
1717

1818
const xTranslationOnLimits = '5px';
@@ -104,7 +104,7 @@ const progressBarFulfilledStyle = (percentage: number, color: string) =>
104104
export function ProgressBar({
105105
card,
106106
variant,
107-
size = space_lg,
107+
size = space_sm,
108108
}: {
109109
card: Card;
110110
variant: CardContent | undefined;
@@ -136,7 +136,7 @@ export function ProgressBarEditor({
136136
card,
137137
variant,
138138
readOnly = false,
139-
size = space_lg,
139+
size = space_md,
140140
}: ProgressBarEditorProps): JSX.Element {
141141
const dispatch = useAppDispatch();
142142

‎colab-webapp/src/main/node/app/src/components/cards/SubCardsGrid.tsx‎

Lines changed: 11 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -145,10 +145,19 @@ export default function SubCardsGrid({
145145
const [showMoreCards, setShowMoreCards] = React.useState<boolean>(false);
146146

147147
const effectiveNbCardByRow: number = React.useMemo(() => {
148+
const effectiveMaxRow = max((subCards || []).map(card => card.x)) || 0;
149+
150+
if (effectiveMaxRow < maxCardsInRow) {
151+
if (effectiveMaxRow === 1) {
152+
return 2;
153+
}
154+
return effectiveMaxRow;
155+
}
156+
148157
if (!showMoreCards) {
149158
return maxCardsInRow;
150159
}
151-
const effectiveMaxRow = max((subCards || []).map(card => card.x));
160+
152161
return max([effectiveMaxRow, maxCardsInRow]) || 0;
153162
}, [showMoreCards, subCards, maxCardsInRow]);
154163

@@ -300,7 +309,7 @@ export default function SubCardsGrid({
300309
lightIconButtonStyle,
301310
br_md,
302311
css({
303-
gridColumnStart: maxCardsInRow,
312+
gridColumnStart: effectiveNbCardByRow,
304313
gridRowStart: maxCardsInColumn,
305314
}),
306315
)}

‎colab-webapp/src/main/node/app/src/components/common/element/Avatar.tsx‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -37,8 +37,7 @@ export default function Avatar({ currentUser }: AvatarProps): JSX.Element {
3737
currentUser.firstname && currentUser.lastname
3838
? { first: currentUser.firstname, last: currentUser.lastname }
3939
: undefined;
40-
const uncompleteName =
41-
currentUser.commonname || currentUser.lastname || currentUser.firstname || '?';
40+
const uncompleteName = currentUser.firstname || currentUser.lastname || '?';
4241
const letters = fullName
4342
? `${fullName.first[0]}${fullName.last[0]}`.toUpperCase()
4443
: uncompleteName.slice(0, 2);

‎colab-webapp/src/main/node/app/src/components/common/element/Input.tsx‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -287,6 +287,8 @@ function Input({
287287
updateSize();
288288
}, [inputRef.current?.value, inputRef.current?.style, updateSize]);
289289

290+
updateSize();
291+
290292
const updated = currentInternalValue !== initialValue;
291293

292294
return (

‎colab-webapp/src/main/node/app/src/components/common/layout/DropDownMenu.tsx‎

Lines changed: 46 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -383,58 +383,55 @@ export default function DropDownMenu<T extends string | number | symbol>({
383383
theRef={dropRef}
384384
onClick={clickIn}
385385
align="center"
386-
className={css({ cursor: 'pointer' })}
386+
direction="column"
387+
className={cx(css({ cursor: 'pointer', overflow: 'visible' }), className)}
387388
>
388-
<Flex direction="column" className={cx(css({ overflow: 'visible' }), className)}>
389-
<Flex title={title} onClick={toggle} className={cx(buttonClassName) + ' dropDownButton'}>
390-
{menuIcon === 'BURGER' && (
391-
<span className={open ? openButtonStyle : buttonStyle}></span>
392-
)}
393-
{icon && <Icon icon={icon} />}
394-
{buttonLabel && buttonLabel}
395-
{showSelectedLabel && current.label && current.label}
396-
{menuIcon === 'CARET' && (
397-
<Icon icon={'expand_more'} className={css({ marginLeft: space_sm })} />
398-
)}
399-
</Flex>
400-
{open && (
401-
<div
402-
className={cx(ddOptionsBodyStyle, dropClassName || '')}
403-
ref={n => {
404-
justifyDropMenu(n, n?.parentElement?.querySelector('.dropDownButton'), direction);
405-
}}
406-
>
407-
{entries.map(entry => (
408-
<div
409-
className={cx(
410-
entryStyle,
411-
{
412-
[disabledStyle]: entry.disabled,
413-
},
414-
{
415-
[subDropDownEntryStyle]: entry.subDropDownButton,
416-
},
417-
entryClassName,
418-
)}
419-
key={String(entry.value)}
420-
onClick={() => {
421-
if (entry.action) {
422-
entry.action();
423-
}
424-
if (onSelect != null) {
425-
onSelect(entry);
426-
}
427-
if (closeOnClick) {
428-
setOpen(false);
429-
}
430-
}}
431-
>
432-
{entry.label}
433-
</div>
434-
))}
435-
</div>
389+
<Flex title={title} onClick={toggle} className={cx(buttonClassName) + ' dropDownButton'}>
390+
{menuIcon === 'BURGER' && <span className={open ? openButtonStyle : buttonStyle}></span>}
391+
{icon && <Icon icon={icon} />}
392+
{buttonLabel && buttonLabel}
393+
{showSelectedLabel && current.label && current.label}
394+
{menuIcon === 'CARET' && (
395+
<Icon icon={'expand_more'} className={css({ marginLeft: space_sm })} />
436396
)}
437397
</Flex>
398+
{open && (
399+
<div
400+
className={cx(ddOptionsBodyStyle, dropClassName || '')}
401+
ref={n => {
402+
justifyDropMenu(n, n?.parentElement?.querySelector('.dropDownButton'), direction);
403+
}}
404+
>
405+
{entries.map(entry => (
406+
<div
407+
className={cx(
408+
entryStyle,
409+
{
410+
[disabledStyle]: entry.disabled,
411+
},
412+
{
413+
[subDropDownEntryStyle]: entry.subDropDownButton,
414+
},
415+
entryClassName,
416+
)}
417+
key={String(entry.value)}
418+
onClick={() => {
419+
if (entry.action) {
420+
entry.action();
421+
}
422+
if (onSelect != null) {
423+
onSelect(entry);
424+
}
425+
if (closeOnClick) {
426+
setOpen(false);
427+
}
428+
}}
429+
>
430+
{entry.label}
431+
</div>
432+
))}
433+
</div>
434+
)}
438435
</Flex>
439436
);
440437
} else {

‎colab-webapp/src/main/node/app/src/components/common/layout/Modal.tsx‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -62,24 +62,24 @@ const fullScreenStyle = cx(
6262
// note : the size have been set by a not-UI-expert, feel free to change !
6363
const smallSizeStyle = cx(
6464
css({
65-
height: '13em',
66-
width: '22em',
65+
width: '20em',
66+
height: '12em',
6767
}),
6868
);
6969

7070
// note : the size have been set by a not-UI-expert, feel free to change !
7171
const mediumSizeStyle = cx(
7272
css({
73-
height: '18em',
74-
width: '30em',
73+
width: '48em',
74+
height: '30em',
7575
}),
7676
);
7777

7878
// note : the size have been set by a not-UI-expert, feel free to change !
7979
const largeSizeStyle = cx(
8080
css({
81-
height: '42em',
8281
width: '58em',
82+
height: '42em',
8383
}),
8484
);
8585

‎colab-webapp/src/main/node/app/src/components/documents/texteditor/TextEditor.tsx‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -29,16 +29,18 @@ import { TextNode } from 'lexical';
2929
import * as React from 'react';
3030
import { WebsocketProvider } from 'y-websocket';
3131
import { Doc } from 'yjs';
32-
import { getDisplayName } from '../../../helper';
3332
import useTranslations from '../../../i18n/I18nContext';
3433
import logger from '../../../logger';
3534
import { useCurrentUser } from '../../../store/selectors/userSelector';
3635
import InlineLoading from '../../common/element/InlineLoading';
3736
import { TipsCtx } from '../../common/element/Tips';
37+
import { getDisplayName } from '../../team/UserName';
3838
import { DocumentOwnership } from '../documentCommonType';
3939
import { ExtendedTextNode } from './nodes/ExtendedTextNode';
4040
import { FileNode } from './nodes/FileNode';
4141
import { ImageNode } from './nodes/ImageNode';
42+
import LexicalAutoLinkPlugin from './plugins/AutoLinkPlugin';
43+
import DragDropPaste from './plugins/DragDropPastePlugin';
4244
import EmptinessSensorPlugin from './plugins/EmptinessSensorPlugin';
4345
import FilesPlugin from './plugins/FilesPlugin';
4446
import FloatingFileMenuPlugin from './plugins/FloatingToolbarPlugin/FloatingFileMenuPlugin';
@@ -52,8 +54,6 @@ import TableCellResizerPlugin from './plugins/TablePlugin/TableCellResizerPlugin
5254
import ToolbarPlugin from './plugins/ToolbarPlugin/ToolbarPlugin';
5355
import TreeViewPlugin from './plugins/TreeViewPlugin';
5456
import theme from './theme/EditorTheme';
55-
import LexicalAutoLinkPlugin from "./plugins/AutoLinkPlugin";
56-
import DragDropPaste from "./plugins/DragDropPastePlugin";
5757

5858
const editorContainerStyle = css({
5959
width: '100%',
@@ -125,7 +125,7 @@ export default function TextEditor({ readOnly, docOwnership, url }: TextEditorPr
125125
const tipsCtxt = React.useContext(TipsCtx);
126126

127127
const { currentUser } = useCurrentUser();
128-
const displayName = getDisplayName(currentUser);
128+
const displayName = getDisplayName(i18n, currentUser);
129129

130130
const [floatingAnchorElem, setFloatingAnchorElem] = React.useState<HTMLDivElement | null>(null);
131131
const [isConnected, setIsConnected] = React.useState<boolean>(false);
@@ -232,7 +232,7 @@ export default function TextEditor({ readOnly, docOwnership, url }: TextEditorPr
232232
<TablePlugin />
233233
<TableCellResizerPlugin />
234234
<ImagesPlugin />
235-
<DragDropPaste docOwnership={docOwnership}/>
235+
<DragDropPaste docOwnership={docOwnership} />
236236
<FilesPlugin />
237237
{/* <CardLinkPlugin /> */}
238238
<TabIndentationPlugin />

0 commit comments

Comments
 (0)