Skip to content
This repository was archived by the owner on Jun 13, 2024. It is now read-only.

Commit 2b964b6

Browse files
JarytJaryt
authored
fix: misc patches (#241)
* feat(style): upgraded various styles chore: cleanup chore: cleaned up chore: resolved linting errors feat(style): upgraded various styles chore: cleanup * fix: output of empty matrix * fix: dont set value of orb search * fix: do not set name when there is no duplicate * ƒix: do not set name parameter if there is no duplicate
1 parent ac99cde commit 2b964b6

37 files changed

Lines changed: 212 additions & 126 deletions

‎src/components/atoms/AddButton.tsx‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,6 @@ import AddIcon from '../../icons/ui/AddIcon';
44
const AddButton = (props: ButtonHTMLAttributes<HTMLButtonElement>) => {
55
return (
66
<button
7-
87
type="button"
98
{...props}
109
className={

‎src/components/atoms/Card.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ export interface CardProps {
1212
const Card = ({ truncate, description, ...props }: CardProps) => {
1313
return (
1414
<div className="pb-4">
15-
<div className="p-4 w-full pr-1 border-circle-gray-300 border rounded-sm text-left max-h-36 flex flex-row">
15+
<div className="p-4 w-full pr-1 border-circle-gray-300 border rounded text-left max-h-36 flex flex-row">
1616
<div className="flex flex-col flex-1">
1717
<div className="flex flex-row">
1818
{props.icon}

‎src/components/atoms/Empty.tsx‎

Lines changed: 7 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -9,14 +9,12 @@ export type EmptyProps = {
99

1010
export const Empty = ({ label, Logo, description }: EmptyProps) => {
1111
return (
12-
<>
13-
<div>
14-
{Logo && <Logo className="w-5 h-5 mx-auto" color="#161616" />}
15-
<h2 className="text-sm font-bold text-center p-1">{label}</h2>
16-
{description && (
17-
<div className="text-sm text-center ">{description}</div>
18-
)}
19-
</div>
20-
</>
12+
<div>
13+
{Logo && <Logo className="w-5 h-5 mx-auto" color="#161616" />}
14+
<h2 className="text-sm font-bold text-center text-circle-black p-1">{label}</h2>
15+
{description && (
16+
<div className="text-sm text-center text-circle-black">{description}</div>
17+
)}
18+
</div>
2119
);
2220
};

‎src/components/atoms/Footer.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ export const Footer = ({
88
}: PropsWithChildren<any> & { centered?: boolean }) => {
99
return (
1010
<footer
11-
className={`absolute bottom-0 flex flex-row right-0 py-6 bg-white border-t border-circle-gray-300 ${className}`}
11+
className={`absolute bottom-0 flex flex-row right-0 py-6 px-2 bg-white border-t border-circle-gray-300 ${className}`}
1212
style={{ width: inspectorWidth }}
1313
>
1414
<div className={`flex ${centered ? 'mx-auto' : 'ml-auto'}`}>

‎src/components/atoms/Info.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { createRef, forwardRef, useRef } from 'react';
1+
import { useRef } from 'react';
22
import InfoIcon from '../../icons/ui/InfoIcon';
33
import { useStoreActions } from '../../state/Hooks';
44

@@ -11,7 +11,7 @@ export const Info = ({ description }: { description: string }) => {
1111
ref={ref}
1212
className="my-auto flex ml-1"
1313
onMouseEnter={() => {
14-
updateTooltip({ description, ref, facing: 'bottom'});
14+
updateTooltip({ description, ref, facing: 'bottom' });
1515
}}
1616
onMouseLeave={() => updateTooltip(undefined)}
1717
>

‎src/components/atoms/Select.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -57,7 +57,7 @@ const Select = (props: SelectProps) => {
5757

5858
return (
5959
<DropdownContainer
60-
className={`rounded-sm ${
60+
className={`rounded ${
6161
props.borderless
6262
? 'border-transparent'
6363
: ' border-circle-gray-300 shadow-sm'
@@ -79,11 +79,11 @@ const Select = (props: SelectProps) => {
7979
<ExpandIcon className="w-3 h-5 mr-3 ml-3" expanded={true} />
8080
</div>
8181
</div>
82-
<div className={'bg-white py-2 shadow-lg ' + props.dropdownClassName}>
82+
<div className={'bg-white py-2 shadow-lg flex flex-col ' + props.dropdownClassName}>
8383
{children.map((child, i) => {
8484
return (
8585
<button
86-
className={`px-3 py-1 text-left w-full hover:bg-circle-gray-200 ${
86+
className={`px-3 py-1 text-left hover:bg-circle-gray-200 ${
8787
i > 0 && 'border-t border-circle-gray-300'
8888
}`}
8989
key={i}

‎src/components/atoms/Tooltip.tsx‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import {
22
MutableRefObject,
33
ReactElement,
4-
useCallback,
54
useEffect,
65
useRef,
76
useState,
@@ -40,9 +39,12 @@ const getPos = (
4039
const ToolTip = ({ target, facing, children }: ToolTipProps) => {
4140
const ref = useRef(null);
4241
const [pos, setPos] = useState(getPos(ref.current, target.current, facing));
42+
const cur = ref.current;
43+
const targetCur = target.current;
44+
4345
useEffect(() => {
44-
setPos(getPos(ref.current, target.current, facing));
45-
}, [target, ref.current]);
46+
setPos(getPos(cur, targetCur, facing));
47+
}, [targetCur, cur, facing]);
4648

4749
return (
4850
<div style={pos} ref={ref} className="fixed flex z-30 flex-col">

‎src/components/atoms/WorkflowSelector.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -13,14 +13,14 @@ export const WorkflowSelector = () => {
1313
const addWorkflow = useStoreActions((actions) => actions.define_workflows);
1414

1515
return (
16-
<DropdownContainer className="rounded-md mx-3 my-auto px-2 border border-circle-gray-300 hover:bg-circle-gray-250">
16+
<DropdownContainer alignLeft className="rounded-md mx-3 my-auto px-2 border border-circle-gray-300 hover:bg-circle-gray-250">
1717
<ExpandIcon className="w-3 h-6" expanded={true} />
18-
<div className="rounded-sm border border-circle-gray-300 p-2 z-30 bg-white flex flex-col">
18+
<div className="rounded border border-circle-gray-300 p-2 z-30 bg-white flex flex-col">
1919
{Object.keys(workflows).map((workflow) => (
2020
<button
2121
value={workflow}
2222
key={workflow}
23-
className={`rounded-sm flex w-full hover:bg-circle-gray-250 border-b border-circle-gray-300 p-2`}
23+
className={`rounded flex w-full hover:bg-circle-gray-250 border-b border-circle-gray-300 p-2`}
2424
type="button"
2525
onClick={(e) =>
2626
workflow !== selectedWorkflow && selectWorkflow(workflow)

‎src/components/atoms/form/InspectorProperty.tsx‎

Lines changed: 8 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,6 @@ import {
66
useField,
77
} from 'formik';
88
import { ReactElement, useEffect } from 'react';
9-
import InfoIcon from '../../../icons/ui/InfoIcon';
109
import { Info } from '../Info';
1110
import { SelectField } from '../Select';
1211

@@ -16,6 +15,7 @@ export type InspectorFieldProps = {
1615
as?: string;
1716
type?: string;
1817
value?: any;
18+
labelClassName?: string;
1919
hidden?: boolean;
2020
className?: string;
2121
required?: boolean;
@@ -60,8 +60,9 @@ const getField = (
6060
{...field}
6161
{...props}
6262
className={`${props.type !== 'checkbox' ? 'w-full' : 'ml-auto'}
63-
border rounded p-2 px-4 shadow-sm hover:border-circle-black placeholder-circle-gray-500 ${!field.value && 'bg-circle-gray-100'
64-
} ${error ? 'border-circle-red' : 'border-circle-gray-300'}`}
63+
border rounded p-2 px-4 shadow-sm hover:border-circle-black placeholder-circle-gray-500 ${
64+
!field.value && 'bg-circle-gray-100'
65+
} ${error ? 'border-circle-red' : 'border-circle-gray-300'}`}
6566
></Field>
6667
)
6768
);
@@ -94,11 +95,12 @@ export const FieldlessInspectorProperty = ({
9495
return (
9596
<>
9697
<div
97-
className={`${props.type === 'checkbox' && `flex flex-row`} mb-4 ${props.className
98-
}`}
98+
className={`${props.type === 'checkbox' && `flex flex-row`} mb-4 ${
99+
props.className
100+
}`}
99101
hidden={props.hidden}
100102
>
101-
<div className="flex flex-row mb-2">
103+
<div className={`flex flex-row mb-2 ${props.labelClassName}`}>
102104
<h3 className="font-medium text-sm my-auto text-circle-black">
103105
{label}
104106
</h3>

‎src/components/atoms/form/ListProperty.tsx‎

Lines changed: 8 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -63,8 +63,10 @@ const ListItem = ({
6363
<Draggable key={index} draggableId={`${index}`} index={index}>
6464
{(provided, _) => (
6565
<div
66-
className="w-full mb-2 p-1 px-3
67-
bg-white border border-circle-gray-300 hover:border-circle-black rounded flex flex-row"
66+
className={`w-full mb-2 p-1 px-3
67+
border border-circle-gray-300 hover:border-circle-black shadow-sm rounded flex flex-row ${
68+
children ? 'bg-white' : 'bg-circle-gray-300'
69+
}`}
6870
ref={provided.innerRef}
6971
{...provided.draggableProps}
7072
>
@@ -102,7 +104,6 @@ const ListProperty = (props: ListPropertyProps) => {
102104
<FieldArray
103105
{...field}
104106
name={props.name}
105-
106107
render={(arrayHelper) => (
107108
<FieldlessListProperty
108109
{...props}
@@ -118,7 +119,7 @@ export const FieldlessListProperty = ({
118119
label,
119120
values,
120121
description,
121-
empty: emptyText,
122+
empty,
122123
children,
123124
listItem,
124125
labels,
@@ -132,11 +133,11 @@ export const FieldlessListProperty = ({
132133
}) => {
133134
const [input, , helper] = field;
134135
const ListChild = listItem;
135-
136+
136137
return (
137138
<CollapsibleList
138139
title={
139-
<div className='flex flex-row'>
140+
<div className="flex flex-row">
140141
{label}
141142
{description && <Info description={description} />}
142143
</div>
@@ -215,7 +216,7 @@ export const FieldlessListProperty = ({
215216
) : (
216217
<>
217218
<div className="ml-2 font-medium text-sm text-circle-gray-500">
218-
{emptyText}
219+
{empty}
219220
</div>
220221
{children}
221222
</>

0 commit comments

Comments
 (0)
⚡