Skip to content

Commit

Permalink
common refractor
Browse files Browse the repository at this point in the history
  • Loading branch information
@shivam-sharma7
shivam-sharma7 committed Aug 14, 2023
1 parent 5dd8800 commit 0fd8509
Show file tree
Hide file tree
Showing 10 changed files with 73 additions and 73 deletions.
12 changes: 6 additions & 6 deletions webapp/src/components/EnumSelect.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,21 +9,21 @@ type EnumSelectProps = {
isDisabled?: boolean
}

export default function EnumSelect(props: EnumSelectProps) {
export default function EnumSelect({options, selected, onSelect, isDisabled}: EnumSelectProps) {
const [isOpen, setOpen] = useState(false)
return (
<Select
isOpen={isOpen}
onToggle={setOpen}
placeholderText="Please select..."
selections={props.selected}
selections={selected}
onSelect={(_, value) => {
props.onSelect(value as string)
setOpen(false)
onSelect(value as string)
setOpen(false)
}}
isDisabled={props.isDisabled}
isDisabled={isDisabled}
>
{Object.entries(props.options).map(([name, title]) => (
{Object.entries(options).map(([name, title]) => (
<SelectOption key={name} value={name}>
{title}
</SelectOption>
Expand Down
4 changes: 2 additions & 2 deletions webapp/src/components/ImportButton.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,7 @@ export default function ImportButton({label, onLoad, onImport, onImported}: Impo
actions={[
<Button
key="import"
variant={overridden ? "danger" : "primary"}
variant={overridden && "danger" || "primary"}
isDisabled={!config || uploading}
onClick={() => {
setUploading(true)
Expand Down Expand Up @@ -103,7 +103,7 @@ export default function ImportButton({label, onLoad, onImport, onImported}: Impo
}}
/>
)}
{parseError !== undefined ? parseError.toString() : null}
{parseError !== undefined && parseError.toString() || null}
{overridden ||
(checking && (
<Bullseye>
Expand Down
80 changes: 40 additions & 40 deletions webapp/src/components/LabelsSelect.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -56,10 +56,10 @@ type LabelsSelectProps = {
style?: CSSProperties
}

export default function LabelsSelect(props: LabelsSelectProps) {
export default function LabelsSelect({disabled, selection, onSelect, source, emptyPlaceholder, optionForAll, forceSplit, fireOnPartial, showKeyHelper, addResetButton, style}: LabelsSelectProps) {
const [availableLabels, setAvailableLabels] = useState<any[]>([])
const initialSelect = props.selection
? Object.entries(props.selection).reduce((acc, [key, value]) => {
const initialSelect = selection
? Object.entries(selection).reduce((acc, [key, value]) => {
if (key !== "toString") {
acc[key] = convertPartial(value)
}
Expand All @@ -71,22 +71,22 @@ export default function LabelsSelect(props: LabelsSelectProps) {
const dispatch = useDispatch()
const teams = useSelector(teamsSelector)
useEffect(() => {
props.source().then((response: any[]) => {
source().then((response: any[]) => {
setAvailableLabels(response)
if (!props.optionForAll && response && response.length === 1) {
props.onSelect({ ...response[0], toString: () => convertLabels(response[0]) })
if (!optionForAll && response && response.length === 1) {
onSelect({ ...response[0], toString: () => convertLabels(response[0]) })
}
}, noop)
}, [props.source, props.onSelect, dispatch, teams, props.optionForAll])
}, [source, onSelect, dispatch, teams, optionForAll])
const all: SelectOptionObject = useMemo(
() => ({
toString: () => props.optionForAll || "",
toString: () => optionForAll || "",
}),
[props.optionForAll]
[optionForAll]
)
const options = useMemo(() => {
const opts = []
if (props.optionForAll) {
if (optionForAll) {
opts.push(all)
}
availableLabels.map(t => ({ ...t, toString: () => convertLabels(t) })).forEach(o => opts.push(o))
Expand Down Expand Up @@ -115,25 +115,25 @@ export default function LabelsSelect(props: LabelsSelectProps) {
}
const filteredOptions = useMemo(() => getFilteredOptions(partialSelect), [availableLabels, partialSelect])
useEffect(() => {
if (!props.fireOnPartial && filteredOptions.length === 1) {
if (!fireOnPartial && filteredOptions.length === 1) {
const str = convertLabels(filteredOptions[0])
props.onSelect({ ...filteredOptions[0], toString: () => str })
onSelect({ ...filteredOptions[0], toString: () => str })
}
}, [filteredOptions])

const empty = !options || options.length === 0
if (empty) {
return props.emptyPlaceholder || null
} else if (!props.forceSplit && availableLabels.length < 16) {
return emptyPlaceholder || null
} else if (!forceSplit && availableLabels.length < 16) {
return (
<InnerSelect
disabled={props.disabled || empty}
disabled={disabled || empty}
all={all}
selection={props.selection === null ? all : props.selection}
selection={selection === null && all || selection}
options={options}
onSelect={props.onSelect}
onSelect={onSelect}
placeholderText="Choose labels..."
style={props.style}
style={style}
/>
)
} else {
Expand All @@ -153,12 +153,12 @@ export default function LabelsSelect(props: LabelsSelectProps) {
.sort()
return (
<SplitItem key={key}>
{props.showKeyHelper && <HelperText>{key}:</HelperText>}
{showKeyHelper && <HelperText>{key}:</HelperText>}
<InnerSelect
disabled={!!props.disabled}
disabled={!!disabled}
isTypeahead
hasOnlyOneOption={opts.length === 1 && partialSelect[key] === undefined}
selection={opts.length === 1 ? opts[0] : partialSelect[key]}
selection={opts.length === 1 && opts[0] || partialSelect[key]}
options={opts}
onSelect={value => {
const partial = { ...partialSelect }
Expand All @@ -168,12 +168,12 @@ export default function LabelsSelect(props: LabelsSelectProps) {
delete partial[key]
}
setPartialSelect(partial)
if (props.fireOnPartial) {
if (fireOnPartial) {
const fo = getFilteredOptions(partial)
if (fo.length === 1) {
props.onSelect(fo[0])
onSelect(fo[0])
}
props.onSelect(partial)
onSelect(partial)

}
}}
Expand All @@ -187,21 +187,21 @@ export default function LabelsSelect(props: LabelsSelectProps) {
</SplitItem>
)
})
if (props.addResetButton) {
if (addResetButton) {
items.push(
<SplitItem style={{ alignSelf: "end" }} key="__reset_button">
<Button
onClick={() => {
setPartialSelect({})
props.onSelect({})
setPartialSelect({})
onSelect({})
}}
>
Reset
</Button>
</SplitItem>
)
}
return <Split style={props.style}>{items}</Split>
return <Split style={style}>{items}</Split>
}
}

Expand All @@ -218,31 +218,31 @@ type InnerSelectProps = {
style?: CSSProperties
}

function InnerSelect(props: InnerSelectProps) {
function InnerSelect({disabled, isTypeahead, hasOnlyOneOption, selection, options, all, onSelect, onOpen, placeholderText, style}: InnerSelectProps) {
const [open, setOpen] = useState(false)
return (
<Select
isDisabled={props.disabled || props.hasOnlyOneOption}
variant={props.isTypeahead ? "typeahead" : "single"}
isDisabled={disabled || hasOnlyOneOption}
variant={isTypeahead ? "typeahead" : "single"}
isOpen={open}
onToggle={expanded => {
if (expanded && props.onOpen) {
props.onOpen()
if (expanded && onOpen) {
onOpen()
}
setOpen(expanded)
}}
selections={[props.selection === null ? props.all : props.selection]}
selections={[selection === null && all || selection]}
onSelect={(_, item) => {
props.onSelect(item === props.all ? null : item)
onSelect(item === all && null || item)
setOpen(false)
}}
onClear={props.hasOnlyOneOption ? undefined : () => props.onSelect(undefined)}
onClear={hasOnlyOneOption ? undefined : () => onSelect(undefined)}
menuAppendTo="parent"
placeholderText={props.placeholderText}
style={props.style}
width={props.style?.width || "auto"}
placeholderText={placeholderText}
style={style}
width={style?.width || "auto"}
>
{props.options.map((labels: SelectOptionObject | string, i: number) => (
{options.map((labels: SelectOptionObject | string, i: number) => (
<SelectOption key={i} value={labels} />
))}
</Select>
Expand Down
4 changes: 2 additions & 2 deletions webapp/src/components/NotificationMethodSelect.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,8 +27,8 @@ export default function NotificationMethodSelect({isDisabled, method, onChange}:
}}
placeholderText="Please select..."
>
{methods.map((m, i) => (
<SelectOption key={i} value={m} />
{methods.map((method, i) => (
<SelectOption key={i} value={method} />
))}
</Select>
)
Expand Down
18 changes: 9 additions & 9 deletions webapp/src/components/OptionalFunction.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,40 +11,40 @@ type OptionalFunctionProps = {
defaultFunc: string
}

export default function OptionalFunction(props: OptionalFunctionProps) {
if (props.func === undefined || props.func === null) {
if (props.readOnly) {
return <>{props.undefinedText} </>
export default function OptionalFunction({func, onChange, readOnly, undefinedText, addText, defaultFunc}: OptionalFunctionProps) {
if (func === undefined || func === null) {
if (readOnly) {
return <>{undefinedText} </>
} else {
return (
<Button
style={{ padding: 0, marginTop: "6px" }}
variant="link"
onClick={() => {
props.onChange(props.defaultFunc)
onChange(defaultFunc)
}}
>
<AddCircleOIcon />
{"\u00A0"}
{props.addText}
{addText}
</Button>
)
}
} else {
// failsafe if the wrong type gets passed in
const funcAsString = typeof props.func === "string" ? props.func : (props.func as any).toString()
const funcAsString = typeof func === "string" ? func : (func as any).toString()
return (
<div style={{ minHeight: "100px", height: "100px", resize: "vertical", overflow: "auto" }}>
<Editor
value={funcAsString}
onChange={value => {
props.onChange(value?.trim() || "")
onChange(value?.trim() || "")
}}
language="typescript"
options={{
wordWrap: "on",
wrappingIndent: "DeepIndent",
readOnly: props.readOnly,
readOnly: readOnly,
}}
/>
</div>
Expand Down
2 changes: 1 addition & 1 deletion webapp/src/components/SplitForm.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -83,7 +83,7 @@ export default function SplitForm<I extends Item>(props: SplitFormProps<I>) {
const newItems = props.items.filter(t => t.id !== props.selected?.id)
props.onDelete(item)
props.onChange(newItems)
props.onSelected(newItems.length > 0 ? newItems[0] : undefined)
props.onSelected(newItems.length > 0 && newItems[0] || undefined)
}
}
return (
Expand Down
2 changes: 1 addition & 1 deletion webapp/src/components/Table.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -127,7 +127,7 @@ function Table<D extends object>({
<th
className={clsx(
"pf-c-table__sort",
columnProps.isSorted ? "pf-m-selected" : ""
columnProps.isSorted && "pf-m-selected" || ""
)}
{...column.getHeaderProps(columnProps.getSortByToggleProps())}
>
Expand Down
4 changes: 2 additions & 2 deletions webapp/src/components/ViewSelect.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,8 +18,8 @@ export default function ViewSelect({views, viewId, onChange}: ViewSelectProps) {
onToggle={setOpen}
selections={selected !== undefined ? { ...selected, toString: () => selected.name } : undefined}
onSelect={(_, item) => {
onChange((item as View).id)
setOpen(false)
onChange((item as View).id)
setOpen(false)
}}
>
{views.map(view => (
Expand Down
4 changes: 2 additions & 2 deletions webapp/src/domain/schemas/FindUsagesModal.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -142,10 +142,10 @@ export default function FindUsagesModal(props: FindUsagesModalProps) {
</Title>
{schemas ? (
<List>
{schemas.map((s, i) => (
{schemas.map((shema, i) => (
<ListItem key={i}>
{/* TODO: looks like this is not navigating anywhere but IDK why */}
<NameUri isLink={true} onNavigate={() => props.onClose()} descriptor={s} />
<NameUri isLink={true} onNavigate={() => props.onClose()} descriptor={shema} />
</ListItem>
))}
</List>
Expand Down
16 changes: 8 additions & 8 deletions webapp/src/domain/schemas/Labels.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,7 @@ type LabelsProps = {
funcsRef: TabFunctionsRef
}

export default function Labels(props: LabelsProps) {
export default function Labels({schemaId, schemaUri, funcsRef}: LabelsProps) {
const [loading, setLoading] = useState(false)
const [labels, setLabels] = useState<LabelEx[]>([])
const [selected, setSelected] = useState<LabelEx>()
Expand All @@ -53,7 +53,7 @@ export default function Labels(props: LabelsProps) {
const isTesterForLabel = useTester(selected?.owner || "__no_owner__")
const defaultTeam = useSelector(defaultTeamSelector)
const dispatch = useDispatch()
props.funcsRef.current = {
funcsRef.current = {
save: () =>
Promise.all([
...labels
Expand Down Expand Up @@ -96,7 +96,7 @@ export default function Labels(props: LabelsProps) {
const history = useHistory()
useEffect(() => {
setLoading(true)
Api.schemaServiceLabels(props.schemaId)
Api.schemaServiceLabels(schemaId)
.then(
labels => {
setLabels(labels)
Expand All @@ -118,11 +118,11 @@ export default function Labels(props: LabelsProps) {
dispatch,
error,
"LIST_LABELS",
"Failed to fetch labels for schema " + props.schemaUri
"Failed to fetch labels for schema " + schemaUri
).catch(noop)
)
.finally(() => setLoading(false))
}, [props.schemaId, resetCounter])
}, [schemaId, resetCounter])

return (
<>
Expand All @@ -143,7 +143,7 @@ export default function Labels(props: LabelsProps) {
extractors: [],
owner: defaultTeam || "",
access: 0 as Access,
schemaId: props.schemaId,
schemaId: schemaId,
filtering: true,
metrics: true,
modified: true,
Expand Down Expand Up @@ -217,7 +217,7 @@ export default function Labels(props: LabelsProps) {
{selected.extractors.map((extractor, i) => {
return (
<JsonExtractor
schemaUri={props.schemaUri}
schemaUri={schemaUri}
key={i}
jsonpathTarget="dataset"
extractor={extractor}
Expand Down Expand Up @@ -250,7 +250,7 @@ export default function Labels(props: LabelsProps) {
Test label calculation
</Button>
<TestLabelModal
uri={props.schemaUri}
uri={schemaUri}
label={selected}
isOpen={testLabelModalOpen}
onClose={() => setTestLabelModalOpen(false)}
Expand Down

0 comments on commit 0fd8509

Please sign in to comment.