Skip to content

Commit 5c23021

Browse files
JWittmeyerlumburovskalina
JWittmeyer
and
lumburovskalina
authored
v1.17.0 (#28)
* Switch to specific IconPreset * Remove warning for bricks * Admin message should always stay on the bottom right * Fix then setting the search value * Web sockets const add --------- Co-authored-by: Lina <lina.lumburovska@kern.ai>
1 parent 1577856 commit 5c23021

File tree

5 files changed

+60
-23
lines changed

5 files changed

+60
-23
lines changed

‎components/AdminMessages.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ export default function AdminMessages(props: AdminMessagesProps) {
1313
props.setActiveAdminMessages(adminMessagesCopy);
1414
}
1515

16-
return (<div className={`pointer-events-none font-dm-sans flex-col right-0 absolute z-30 inset-y-0 sm:flex sm:justify-end sm:px-6 sm:pb-5 lg:px-8 ${isOnLabelingPage ? 'bottom-8' : 'bottom-0'}`}>
16+
return (<div className={`pointer-events-none font-dm-sans flex-col right-0 fixed z-30 inset-y-0 sm:flex sm:justify-end sm:px-6 sm:pb-5 lg:px-8 ${isOnLabelingPage ? 'bottom-8' : 'bottom-0'}`}>
1717
{props.adminMessages && props.adminMessages.map((activeMessage, index) => (
1818
<div key={activeMessage.id} className={`pointer-events-auto items-center justify-between gap-x-6 py-2.5 mt-2 border px-6 sm:rounded-xl sm:py-3 sm:pr-3.5 sm:pl-4 ${activeMessage.borderColor} ${activeMessage.backgroundColor} ${activeMessage.visible ? 'flex' : 'hidden'}`}
1919
style={{ maxWidth: props.maxWidth ?? 'calc(100vw - 200px)' }}>

‎components/KernDropdown.tsx

Lines changed: 7 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -4,11 +4,11 @@ import { KernDropdownProps } from '../types/dropdown';
44
import { combineClassNames } from '../../javascript-functions/general';
55
import { SELECT_ALL, checkDropdownProps, getActiveNegateGroupColor, getDropdownDisplayText, prepareDropdownOptionsToArray, reduceColorProperty, setOptionsWithSearchBar } from '../helpers/dropdown-helper';
66
import { Tooltip } from '@nextui-org/react';
7-
import { IconChevronDown, IconDotsVertical, IconExternalLink, IconLoader } from '@tabler/icons-react';
7+
import { IconChevronDown, IconDotsVertical, IconExternalLink } from '@tabler/icons-react';
88
import { IconTrashXFilled } from '@tabler/icons-react';
99
import useOnClickOutside from '../hooks/useHooks/useOnClickOutside';
10-
import * as TablerIcons from '@tabler/icons-react';
1110
import { useDefaults } from '../hooks/useDefaults';
11+
import SVGIcon from './SVGIcon';
1212

1313
const DEFAULTS = { fontSizeClass: 'text-xs' };
1414

@@ -18,7 +18,7 @@ export default function KernDropdown(props: KernDropdownProps) {
1818
const [dropdownCaptions, setDropdownCaptions] = useState<any[]>([]);
1919
const [disabledOptions, setDisabledOptions] = useState<boolean[]>([]);
2020
const [backgroundColors, setBackgroundColors] = useState<string[]>([]);
21-
const [searchText, setSearchText] = useState(props.searchDefaultValue ?? '');
21+
const [searchText, setSearchText] = useState('');
2222
const [isOpen, setIsOpen] = useState(false);
2323
const [selectedCheckboxes, setSelectedCheckboxes] = useState<any[]>([]);
2424
const [position, setPosition] = useState(null);
@@ -38,6 +38,10 @@ export default function KernDropdown(props: KernDropdownProps) {
3838
props.onSearchChange(searchText)
3939
}, [props.onSearchChange, searchText]);
4040

41+
useEffect(() => {
42+
setSearchText(props.searchDefaultValue ?? '');
43+
}, [props.searchDefaultValue]);
44+
4145
useEffect(() => {
4246
const prepareOptions = prepareDropdownOptionsToArray(props.options, props.hasSearchBar, props.valuePropertyPath);
4347
if (props.hasSearchBar) {
@@ -279,18 +283,3 @@ function HoverBox(props: { position: any, hoverBox: any }) {
279283
</div>}
280284
</>)
281285
}
282-
283-
function SVGIcon({ icon, size, strokeWidth, useFillForIcons }) {
284-
const Icon = TablerIcons[icon];
285-
if (Icon) {
286-
return (
287-
<Icon
288-
size={size}
289-
strokeWidth={strokeWidth}
290-
className={`${useFillForIcons ? 'fill-gray-800' : ''}`}
291-
/>
292-
)
293-
} else {
294-
return <IconLoader size={size} strokeWidth={strokeWidth} />
295-
}
296-
}

‎components/SVGIcon.tsx

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
import { IconBolt, IconChevronDown, IconCode, IconDotsVertical, IconExternalLink, IconFileInfo, IconFilePencil, IconLoader, IconPlayerPlayFilled, IconSquare, IconSquareCheck, IconTrash } from '@tabler/icons-react';
2+
3+
export const SUPPORTED_ICONS = ['IconCode', 'IconBolt', 'IconSquareCheck', 'IconSquare', 'IconPlayerPlayFilled', 'IconTrash', 'IconExternalLink',
4+
'IconLoader', 'IconFilePencil', 'IconFileInfo'
5+
]
6+
7+
type SVGIconProps = {
8+
icon: string,
9+
size?: number,
10+
strokeWidth?: number,
11+
useFillForIcons?: boolean
12+
}
13+
14+
export default function SVGIcon(props: SVGIconProps) {
15+
switch (props.icon) {
16+
case 'IconCode':
17+
return <IconCode size={props.size} strokeWidth={props.strokeWidth} className={`${props.useFillForIcons ? 'fill-gray-800' : ''}`} />
18+
case 'IconBolt':
19+
return <IconBolt size={props.size} strokeWidth={props.strokeWidth} className={`${props.useFillForIcons ? 'fill-gray-800' : ''}`} />
20+
case 'IconSquareCheck':
21+
return <IconSquareCheck size={props.size} strokeWidth={props.strokeWidth} className={`${props.useFillForIcons ? 'fill-gray-800' : ''}`} />
22+
case 'IconSquare':
23+
return <IconSquare size={props.size} strokeWidth={props.strokeWidth} className={`${props.useFillForIcons ? 'fill-gray-800' : ''}`} />
24+
case 'IconPlayerPlayFilled':
25+
return <IconPlayerPlayFilled size={props.size} strokeWidth={props.strokeWidth} className={`${props.useFillForIcons ? 'fill-gray-800' : ''}`} />
26+
case 'IconTrash':
27+
return <IconTrash size={props.size} strokeWidth={props.strokeWidth} className={`${props.useFillForIcons ? 'fill-gray-800' : ''}`} />
28+
case 'IconExternalLink':
29+
return <IconExternalLink size={props.size} strokeWidth={props.strokeWidth} className={`${props.useFillForIcons ? 'fill-gray-800' : ''}`} />
30+
case 'IconChevronDown':
31+
return <IconChevronDown size={props.size} strokeWidth={props.strokeWidth} className={`${props.useFillForIcons ? 'fill-gray-800' : ''}`} />
32+
case 'IconDotsVertical':
33+
return <IconDotsVertical size={props.size} strokeWidth={props.strokeWidth} className={`${props.useFillForIcons ? 'fill-gray-800' : ''}`} />
34+
case 'IconLoader':
35+
return <IconLoader size={props.size} strokeWidth={props.strokeWidth} className={`${props.useFillForIcons ? 'fill-gray-800' : ''}`} />
36+
case 'IconFilePencil':
37+
return <IconFilePencil size={props.size} strokeWidth={props.strokeWidth} className={`${props.useFillForIcons ? 'fill-gray-800' : ''}`} />
38+
case 'IconFileInfo':
39+
return <IconFileInfo size={props.size} strokeWidth={props.strokeWidth} className={`${props.useFillForIcons ? 'fill-gray-800' : ''}`} />
40+
default: return <IconLoader size={props.size} strokeWidth={props.strokeWidth} className={`${props.useFillForIcons ? 'fill-gray-800' : ''}`} />
41+
}
42+
43+
}

‎helpers/dropdown-helper.ts

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import { SUPPORTED_ICONS } from "../components/SVGIcon";
12
import { KernDropdownProps } from "../types/dropdown";
23

34
export const SELECT_ALL = 'Select all';
@@ -67,8 +68,12 @@ export function checkDropdownProps(props: KernDropdownProps) {
6768
throw new Error('Dropdown: linkList should be used with optionsHaveLink');
6869
} else if (props.hoverBoxList && !props.optionsHaveHoverBox) {
6970
throw new Error('Dropdown: hoverBoxList should be used with optionsHaveHoverBox');
70-
} else if (props.iconsArray && (props.iconsArray.length != props.options.length)) {
71-
throw new Error('Dropdown: iconsArray length must be equal to options length');
71+
} else if (props.iconsArray) {
72+
if (props.iconsArray.length != props.options.length) {
73+
throw new Error('Dropdown: iconsArray length must be equal to options length');
74+
} else if (props.iconsArray.some((icon: string) => !SUPPORTED_ICONS.includes(icon))) {
75+
throw new Error('Dropdown: icon not yet supported');
76+
}
7277
} else if (props.useFillForIcons && (props.useFillForIcons.length != props.options.length)) {
7378
throw new Error('Dropdown: useFillForIcons length must be equal to options length');
7479
}
@@ -135,4 +140,4 @@ export function getActiveNegateGroupColor(group: any) {
135140
}
136141
return '#4e46e5';
137142

138-
}
143+
}

‎hooks/web-socket/constants.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -91,7 +91,7 @@ export const WHITELIST_LOOKUP_REFINERY = {
9191
[CurrentPageSubKey.NONE]: ['labeling_task_updated', 'labeling_task_created', 'label_created', 'label_deleted', 'labeling_task_deleted', 'information_source_deleted', 'information_source_updated', 'model_callback_update_statistics', 'embedding_deleted', 'embedding', 'payload_finished', 'payload_failed', 'payload_created', 'payload_update_statistics']
9292
},
9393
[CurrentPage.HEURISTICS]: {
94-
[CurrentPageSubKey.NONE]: ['labeling_task_updated', 'labeling_task_created', 'labeling_task_deleted', 'information_source_created', 'information_source_updated', 'information_source_deleted', 'payload_finished', 'payload_failed', 'payload_created', 'payload_update_statistics', 'embedding_deleted', 'weak_supervision_started', 'weak_supervision_finished'],
94+
[CurrentPageSubKey.NONE]: ['labeling_task_updated', 'labeling_task_created', 'labeling_task_deleted', 'information_source_created', 'information_source_updated', 'information_source_deleted', 'payload_finished', 'payload_failed', 'payload_created', 'payload_update_statistics', 'embedding_deleted', 'weak_supervision_started', 'weak_supervision_finished', 'tokenization'],
9595

9696
},
9797
[CurrentPage.EDIT_RECORDS]: {

0 commit comments

Comments
 (0)