Skip to content

Commit 2d71502

Browse files
lumburovskalinalumburovskalina
authored
Fe config sync (#34)
* Added shared Tailwind config * Added missing package * Remove unused code * Font bold changed and added global style for checkboxes and inputs on focus * Smaller UI adjustments * Package upgrade * Next parent image updated * PR comments
1 parent befadd6 commit 2d71502

File tree

63 files changed

+206
-237
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

63 files changed

+206
-237
lines changed

‎.gitmodules

+3
Original file line numberDiff line numberDiff line change
@@ -4,3 +4,6 @@
44
[submodule "submodules/react-components"]
55
path = submodules/react-components
66
url = https://github.com/code-kern-ai/submodule-react-components.git
7+
[submodule "submodules/tailwind-config"]
8+
path = submodules/tailwind-config
9+
url = https://github.com/code-kern-ai/submodule-tailwind-config.git

‎Dockerfile

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
FROM kernai/refinery-parent-images:v1.17.0-next
1+
FROM kernai/refinery-parent-images:v1.18.0-next
22

33
WORKDIR /app
44
COPY package*.json /app/

‎dev.Dockerfile

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
FROM kernai/refinery-parent-images:v1.17.0-next
1+
FROM kernai/refinery-parent-images:v1.18.0-next
22

33
WORKDIR /app
44

‎package.json

+17-15
Original file line numberDiff line numberDiff line change
@@ -9,20 +9,21 @@
99
"lint": "next lint"
1010
},
1111
"dependencies": {
12-
"@headlessui/react": "^1.7.18",
13-
"@heroicons/react": "^2.0.17",
14-
"@monaco-editor/react": "^4.5.1",
12+
"@headlessui/react": "^1.7.19",
13+
"@headlessui/tailwindcss": "^0.2.1",
14+
"@heroicons/react": "^2.1.4",
15+
"@monaco-editor/react": "^4.6.0",
1516
"@nextui-org/react": "^1.0.0-beta.13",
16-
"@reduxjs/toolkit": "^1.9.5",
17-
"@tabler/icons-react": "^3.2.0",
18-
"@tailwindcss/forms": "^0.5.3",
19-
"@types/jest": "^29.5.2",
20-
"@types/node": "18.15.11",
21-
"@types/react": "^18.0.28",
22-
"@types/react-dom": "^18.2.4",
23-
"autoprefixer": "^10.4.8",
24-
"aws-sdk": "^2.1460.0",
25-
"chart.js": "^4.3.0",
17+
"@reduxjs/toolkit": "^1.9.7",
18+
"@tabler/icons-react": "^3.8.0",
19+
"@tailwindcss/forms": "^0.5.7",
20+
"@types/jest": "^29.5.12",
21+
"@types/node": "18.19.39",
22+
"@types/react": "^18.3.3",
23+
"@types/react-dom": "^18.3.0",
24+
"autoprefixer": "^10.4.19",
25+
"aws-sdk": "^2.1653.0",
26+
"chart.js": "^4.4.3",
2627
"clsx": "^1.2.1",
2728
"d3": "^7.8.5",
2829
"d3v4": "^4.2.2",
@@ -36,10 +37,11 @@
3637
"react-chartjs-2": "^5.2.0",
3738
"react-dom": "18.2.0",
3839
"react-dropzone": "^14.2.3",
39-
"react-redux": "^8.1.1",
40+
"react-i18next": "^14.1.2",
41+
"react-redux": "^8.1.3",
4042
"react-router-dom": "^6.10.0",
4143
"rxjs": "^7.8.1",
42-
"tailwindcss": "^3.4.1",
44+
"tailwindcss": "^3.4.4",
4345
"typescript": "^5.1.3"
4446
},
4547
"devDependencies": {

‎postcss.config.js

+3
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,9 @@
11
module.exports = {
22
plugins: {
33
tailwindcss: {},
4+
'postcss-focus-visible': {
5+
replaceWith: '[data-focus-visible-added]',
6+
},
47
autoprefixer: {},
58
},
69
}

‎public/fonts/DMSans-Regular.ttf

-70.3 KB
Binary file not shown.

‎src/components/projects/SampleProjectsDropdown.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -216,7 +216,7 @@ export default function SampleProjectsDropdown() {
216216
</Menu.Items>
217217
</Transition>
218218
<Modal modalName={ModalEnum.SAMPLE_PROJECT_TITLE} acceptButton={acceptButton}>
219-
<h1 className="flex flex-grow justify-center text-lg text-gray-900 font-bold">Enter project title</h1>
219+
<h1 className="flex flex-grow justify-center text-lg text-gray-900 font-medium">Enter project title</h1>
220220
<div className="text-sm text-gray-500 mb-4 text-center">
221221
Please enter a custom title for the sample project
222222
</div>

‎src/components/projects/projectId/admin/DeletePersonalTokenModal.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ export default function DeletePersonalToken(props: PersonalTokenModalProps) {
2828
return (<Modal modalName={ModalEnum.DELETE_PERSONAL_TOKEN} abortButton={abortButton}>
2929
<div className="flex flex-grow justify-center text-lg leading-6 text-gray-900 font-medium">Warning</div>
3030
<p className="mt-2 text-gray-500 text-sm">Are you sure you want to delete this personal access token?</p>
31-
<p className="text-gray-500 text-sm font-bold">
31+
<p className="text-gray-500 text-sm font-semibold">
3232
This is not reversible and the token will not be longer usable!
3333
</p>
3434
</Modal>)

‎src/components/projects/projectId/admin/NewPersonalTokenModal.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -59,9 +59,9 @@ export default function NewPersonalToken(props: PersonalTokenModalProps) {
5959
return (<Modal modalName={ModalEnum.NEW_PERSONAL_TOKEN} hasOwnButtons={true}>
6060
<div className="flex flex-grow justify-center text-lg leading-6 text-gray-900 font-medium">Add a personal access token </div>
6161
<div className="flex flex-row justify-center items-center mb-2">
62-
<div className="text-gray-500 text-xs font-bold">This token is created only once and can not be restored. Please keep it safe.</div>
62+
<div className="text-gray-500 text-xs font-medium">This token is created only once and can not be restored. Please keep it safe.</div>
6363
</div>
64-
<div className="grid grid-cols-2 gap-2 items-center max-w-sm" style={{ gridTemplateColumns: 'max-content auto' }}>
64+
<div className="grid grid-cols-2 gap-2 items-center" style={{ gridTemplateColumns: 'auto 80%' }}>
6565
<Tooltip content={TOOLTIPS_DICT.ADMIN_PAGE.EXPIRATION_TIME} color="invert" placement="right">
6666
<span className="cursor-help card-title mb-0 label-text flex"><span className="underline filtersUnderline">Expiration time</span></span>
6767
</Tooltip>

‎src/components/projects/projectId/attributes/attributeId/ViewRecordDetailsModal.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ export default function ViewRecordDetailsModal(props: ViewRecordDetailsModalProp
2121
<RecordDisplay
2222
attributes={attributes}
2323
record={modalViewRecordDetails.record} />
24-
<div className="text-sm leading-5 text-left text-gray-900 font-bold">Calculated value</div>
24+
<div className="text-sm leading-5 text-left text-gray-900 font-medium">Calculated value</div>
2525
<div className="text-sm leading-5 text-left text-gray-500 font-normal">
2626
{props.currentAttribute.dataType != DataTypeEnum.EMBEDDING_LIST ? <span>
2727
{props.sampleRecords.calculatedAttributes[modalViewRecordDetails.recordIdx]}

‎src/components/projects/projectId/data-browser/SearchGroups.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -595,7 +595,7 @@ export default function SearchGroups() {
595595
<ChevronDownIcon className="text-gray-700" />
596596
</div>
597597
<div className="flex flex-col">
598-
<div className="font-bold truncate" style={{ maxWidth: '20rem' }}>
598+
<div className="font-semibold truncate" style={{ maxWidth: '20rem' }}>
599599
{searchGroupsStore[group.key].name}
600600
{searchGroupsStore[group.key].nameAdd != '' && <label className="font-normal ml-2">{searchGroupsStore[group.key].nameAdd}</label>}
601601
</div>
@@ -755,7 +755,7 @@ export default function SearchGroups() {
755755
</div>
756756
</div>
757757

758-
<div className="mt-2 font-bold">Heuristics</div>
758+
<div className="mt-2 font-semibold">Heuristics</div>
759759
{fullSearchStore[group.key].groupElements['heuristics'] && fullSearchStore[group.key].groupElements['heuristics'].length == 0 ? (<div className="text-sm text-gray-400">No heuristics associated with this task</div>) : (<div className="flex flex-col">
760760
<div className="flex items-center cursor-pointer border-t border-t-gray-300 border-b border-b-gray-300" onClick={() => updateIsDifferent(group.key, fullSearchStore[group.key].groupElements['isWithDifferentResults'])}>
761761
<div style={{ backgroundColor: fullSearchStore[group.key].groupElements['isWithDifferentResults']?.color, borderColor: fullSearchStore[group.key].groupElements['isWithDifferentResults']?.color }}

‎src/components/projects/projectId/data-browser/modals/ConfigurationModal.tsx

+7-7
Original file line numberDiff line numberDiff line change
@@ -57,7 +57,7 @@ export default function ConfigurationModal() {
5757
<div className="mb-2">
5858
<fieldset className="space-y-5">
5959
<div className="relative flex items-start text-left">
60-
<div className="flex items-center h-5">
60+
<div className="flex items-center h-6">
6161
<input id="comments" type="checkbox" onChange={(e) => {
6262
toggleConfigurationOption('highlightText');
6363
}} checked={configuration.highlightText}
@@ -69,7 +69,7 @@ export default function ConfigurationModal() {
6969
</div>
7070
</div>
7171
<div className="relative flex items-start text-left">
72-
<div className="flex items-center h-5">
72+
<div className="flex items-center h-6">
7373
<input id="comments" type="checkbox" onChange={() => toggleConfigurationOption('weakSupervisionRelated')} checked={configuration.weakSupervisionRelated}
7474
className="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded cursor-pointer" />
7575
</div>
@@ -79,7 +79,7 @@ export default function ConfigurationModal() {
7979
</div>
8080
</div>
8181
<div className="relative flex items-start text-left">
82-
<div className="flex items-center h-5">
82+
<div className="flex items-center h-6">
8383
<input id="comments" type="checkbox" onChange={toggleLineBreaks} checked={configuration.lineBreaks != LineBreaksType.NORMAL}
8484
className="focus:ring-indigo-500 h-4 w-4 text-indigo-600 border-gray-300 rounded cursor-pointer" />
8585
</div>
@@ -89,15 +89,15 @@ export default function ConfigurationModal() {
8989
</div>
9090
</div>
9191
{configuration.lineBreaks != LineBreaksType.NORMAL && <div className="px-10">
92-
<div className="flex flex-row items-start mt-2 text-left">
92+
<div className="flex flex-row items-center mt-2 text-left">
9393
<input type="radio" checked={configuration.lineBreaks == LineBreaksType.IS_PRE_WRAP} onChange={toggleLineBreaksPreWrap} name="lineBreaks" id="preWrap"
9494
className="focus:ring-blue-500 h-6 w-4 text-blue-600 border-gray-200 cursor-pointer" />
9595
<label htmlFor="preWrap" className="ml-1 block text-sm font-medium text-gray-700 cursor-pointer">
9696
<span>Pre-wrap</span>
9797
<p className="text-gray-500 text-sm cursor-pointer">Preserves whitespace and line breaks </p>
9898
</label>
9999
</div>
100-
<div className="flex flex-row items-start mt-2 text-left">
100+
<div className="flex flex-row items-center mt-2 text-left">
101101
<input type="radio" checked={configuration.lineBreaks == LineBreaksType.IS_PRE_LINE} onChange={toggleLineBreaksPreWrap} name="lineBreaks" id="preLine"
102102
className="focus:ring-blue-500 h-6 w-4 text-blue-600 border-gray-200 cursor-pointer" />
103103
<label htmlFor="preLine" className="ml-1 block text-sm font-medium text-gray-700 cursor-pointer">
@@ -108,12 +108,12 @@ export default function ConfigurationModal() {
108108
</div>}
109109
</fieldset>
110110
<div className="mt-3 text-sm text-gray-900 text-left">Select which separator you want to use for the IN operator</div>
111-
<div className="flex flex-row items-start mt-2 text-left">
111+
<div className="flex flex-row items-center mt-2 text-left">
112112
<input type="radio" checked={configuration.separator == ','} onChange={toggleSeparator} name="comma" id="comma"
113113
className="focus:ring-blue-500 h-6 w-4 text-blue-600 border-gray-200 cursor-pointer" />
114114
<label htmlFor="comma" className="ml-1 block text-sm font-medium text-gray-700 cursor-pointer">Comma(,)</label>
115115
</div>
116-
<div className="flex flex-row items-start mt-2 text-left">
116+
<div className="flex flex-row items-center mt-2 text-left">
117117
<input type="radio" checked={configuration.separator == '-'} onChange={toggleSeparator} name="dash" id="dash"
118118
className="focus:ring-blue-500 h-6 w-4 text-blue-600 border-gray-200 cursor-pointer" />
119119
<label htmlFor="dash" className="ml-1 block text-sm font-medium text-gray-700 cursor-pointer">Dash(-)</label>

‎src/components/projects/projectId/data-browser/modals/DataSliceInfoModal.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ export default function DataSliceInfoModal() {
2727
}
2828

2929
return (<Modal modalName={ModalEnum.DATA_SLICE_INFO}>
30-
<div className="flex flex-grow justify-center mb-4 font-bold">Slice information</div>
30+
<div className="flex flex-grow justify-center mb-4 font-medium">Slice information</div>
3131
{modalSliceInfo.sliceInfo && Object.entries(modalSliceInfo.sliceInfo).map(([key, value]: any) => (
3232
<Fragment key={key}>
3333
{key == "Link" ? (<div>
@@ -45,7 +45,7 @@ export default function DataSliceInfoModal() {
4545
View as expert
4646
</button>
4747
</Tooltip>
48-
</div>) : (<div className="flex flex-grow justify-between gap-8">
48+
</div>) : (<div className="flex flex-grow justify-between gap-8 text-sm">
4949
<p>{key}</p>
5050
<p>{value}</p>
5151
</div>)}

‎src/components/projects/projectId/data-browser/modals/RecordCommentsModal.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ export default function RecordCommentsModal() {
1111
{modalComments && modalComments.commentsData && modalComments.commentsData.map((comment, index) => (
1212
<div className="break-words" key={comment.comment}>
1313
<div className="flex flex-grow justify-between gap-8">
14-
<p style={{ minWidth: '100px' }} className="font-bold">Comment {index + 1}</p>
14+
<p style={{ minWidth: '100px' }} className="font-medium">Comment {index + 1}</p>
1515
<p className="text-gray-500">{comment.comment}</p>
1616
</div></div>
1717
))}

‎src/components/projects/projectId/data-browser/modals/SaveDataSliceModal.tsx

+3-3
Original file line numberDiff line numberDiff line change
@@ -88,10 +88,10 @@ export default function SaveDataSliceModal(props: { fullSearch: {} }) {
8888
return (<Modal modalName={ModalEnum.SAVE_DATA_SLICE} acceptButton={acceptButton}>
8989
<div className="flex flex-grow justify-center text-lg leading-6 text-gray-900 font-medium">Data slice creation</div>
9090
<div className="mb-2 flex flex-grow justify-center text-sm">Save or update the current filter settings as a data slice</div>
91-
<p className="pt-4 text-left">You have two choices.
92-
<label className="block font-bold mt-2">Dynamic:</label>
91+
<p className="pt-4 text-left text-sm">You have two choices.
92+
<label className="block font-semibold mt-2">Dynamic:</label>
9393
Stores the current filter critera and is reapplied whenever the data slice is selected.
94-
<label className="block font-bold mt-2 ">Static:</label>
94+
<label className="block font-semibold mt-2 ">Static:</label>
9595
Used for visualization filters and scope of work for annotators & domain experts. Stores the current records provided by your filter.
9696
These are limited to 10,000 records and can be refreshed if necessary.
9797
</p>

‎src/components/projects/projectId/edit-records/SyncRecordsModal.tsx

+5-5
Original file line numberDiff line numberDiff line change
@@ -76,11 +76,11 @@ export default function SyncRecordsModal(props: SyncRecordsModalProps) {
7676
<div className="text-sm text-gray-700 flex flex-col gap-y-2 mb-2 font-medium">
7777
<div> {syncRecordsModal.syncModalAmount} changes to be synchronized: </div>
7878
<div className="grid gap-px p-px bg-gray-200 rounded-lg" style={{ gridTemplateColumns: 'minmax(auto,100px) max-content minmax(auto,300px) minmax(auto,300px) 50px' }}>
79-
<span className="bg-white font-bold h-full w-full inline-flex items-center justify-center">Record
79+
<span className="bg-white font-semibold h-full w-full inline-flex items-center justify-center">Record
8080
({props.erdData.data?.attributes[0].name})</span>
81-
<span className="bg-white font-bold h-full w-full inline-flex items-center justify-center">Attribute</span>
82-
<span className="bg-white font-bold h-full w-full inline-flex items-center justify-center">Old value</span>
83-
<span className="bg-white font-bold h-full w-full inline-flex items-center justify-center">New value</span>
81+
<span className="bg-white font-semibold h-full w-full inline-flex items-center justify-center">Attribute</span>
82+
<span className="bg-white font-semibold h-full w-full inline-flex items-center justify-center">Old value</span>
83+
<span className="bg-white font-semibold h-full w-full inline-flex items-center justify-center">New value</span>
8484
<span className="bg-white h-full w-full"></span>
8585

8686
{Object.entries(props.erdData.cachedRecordChanges).map(([key, value]: any) => (<Fragment key={key}>
@@ -96,7 +96,7 @@ export default function SyncRecordsModal(props: SyncRecordsModalProps) {
9696
</div>
9797
{props.erdData.errors && <div className="bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded relative flex flex-col">
9898
<div className="self-center flex flex-row flex-nowrap items-center -mt-1 mb-1">
99-
<strong className="font-bold">Errors while syncing changes</strong>
99+
<strong className="font-semibold">Errors while syncing changes</strong>
100100
<IconAlertTriangleFilled className="h-5 w-5 text-red-400" />
101101
</div>
102102
{props.erdData.errors.map((error, index) => <div key={error} className="text-sm overflow-x-auto m-auto" style={{ maxWidth: '600px' }}>

‎src/components/projects/projectId/heuristics/DeleteHeuristicsModal.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,7 @@ export default function DeleteHeuristicsModal(props: DeleteHeuristicsModalProps)
3636
<div className="text-sm text-gray-500 my-2 flex flex-col">
3737
<span>Are you sure you want to delete selected {props.countSelected <= 1 ? 'heuristic' : 'heuristics'}?</span>
3838
<span>Currently selected {props.countSelected <= 1 ? 'is' : 'are'}:</span>
39-
<span className="whitespace-pre-line font-bold">{props.selectionList}</span>
39+
<span className="whitespace-pre-line font-semibold">{props.selectionList}</span>
4040
</div>
4141
</Modal>)
4242
}

‎src/components/projects/projectId/heuristics/heuristicId/crowd-labeler/CrowdLabeler.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -126,7 +126,7 @@ export default function CrowdLabeler() {
126126
<div className="mx-auto max-w-prose text-base lg:grid lg:max-w-none lg:grid-cols-2 lg:gap-8">
127127
<div>
128128
<h2 className="text-lg font-semibold text-indigo-600">Integrating crowd labelers</h2>
129-
<h3 className="mt-2 text-3xl font-bold leading-8 tracking-tight text-gray-900 sm:text-4xl">
129+
<h3 className="mt-2 text-3xl font-semibold leading-8 tracking-tight text-gray-900 sm:text-4xl">
130130
How it works</h3>
131131
</div>
132132
</div>

‎src/components/projects/projectId/heuristics/heuristicId/labeling-function/ViewDetailsLFModal.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ export default function ViewDetailsLFModal(props: ViewDetailsLFModalProps) {
1818
<RecordDisplay
1919
attributes={attributes}
2020
record={props.sampleRecords.records[modalSampleRecord.currentRecordIdx]} />
21-
<div className="text-sm leading-5 text-left text-gray-900 font-bold">
21+
<div className="text-sm leading-5 text-left text-gray-900 font-medium">
2222
Label data
2323
<div className="flex items-center justify-start">
2424
{Object.entries(props.sampleRecords.records[modalSampleRecord.currentRecordIdx].calculatedLabelsResult).map(([key, value]: any) => (

‎src/components/projects/projectId/heuristics/heuristicId/shared/HeuristicRunButtons.tsx

+2-1
Original file line numberDiff line numberDiff line change
@@ -21,8 +21,9 @@ export default function HeuristicRunButtons(props: HeuristicRunButtonsProps) {
2121

2222
useEffect(() => {
2323
setCanStartHeuristic(checkCanStartHeuristic());
24+
if (!props.checkCanStartHeuristic) return;
2425
props.checkCanStartHeuristic(checkCanStartHeuristic());
25-
}, [currentHeuristic]);
26+
}, [currentHeuristic, props.checkCanStartHeuristic]);
2627

2728
function runHeuristic() {
2829
setJustClickedRun(true);

0 commit comments

Comments
 (0)