chore: add eslint and cleanup (#118)

* refactor: modified existing react imports to conform with the recommended approach of not using the default export directly, since it will be deprecated in one of the future releases. see https://reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html for more info. note: react types don't require importing of react.
refactor: cleaned up some of the imports

* feat: added eslint and fixed all the errors/warning. eslint can now be invoked by running "npm run lint".
chore: updated .gitignore not to include unnecessary artefacts.
refactor: re-organized some of the imports.

* refactor: converted remaining few typed functional components to proper prop argument structure.

* fix: fixed small react-query invalidation bug for the FilterDetails component.

Co-authored-by: anonymous <anonymous>
This commit is contained in:
stacksmash76 2022-02-08 18:10:47 +01:00 committed by GitHub
parent d1f08903d1
commit fe06363530
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
29 changed files with 463 additions and 343 deletions

View file

@ -9,17 +9,15 @@ interface MultiSelectProps {
label?: string;
options?: [] | any;
name: string;
className?: string;
columns?: COL_WIDTHS;
}
const MultiSelect: React.FC<MultiSelectProps> = ({
export const MultiSelect = ({
name,
label,
options,
className,
columns,
}) => (
}: MultiSelectProps) => (
<div
className={classNames(
columns ? `col-span-${columns}` : "col-span-12"
@ -44,9 +42,8 @@ const MultiSelect: React.FC<MultiSelectProps> = ({
labelledBy={name}
value={field.value && field.value.map((item: any) => options.find((o: any) => o.value === item))}
onChange={(values: any) => {
let am = values && values.map((i: any) => i.value)
setFieldValue(field.name, am)
const am = values && values.map((i: any) => i.value);
setFieldValue(field.name, am);
}}
className="dark:bg-gray-700 dark"
/>
@ -55,13 +52,12 @@ const MultiSelect: React.FC<MultiSelectProps> = ({
</div>
);
const IndexerMultiSelect: React.FC<MultiSelectProps> = ({
export const IndexerMultiSelect = ({
name,
label,
options,
className,
columns,
}) => (
}: MultiSelectProps) => (
<div
className={classNames(
columns ? `col-span-${columns}` : "col-span-12"
@ -86,9 +82,8 @@ const IndexerMultiSelect: React.FC<MultiSelectProps> = ({
labelledBy={name}
value={field.value && field.value.map((item: any) => options.find((o: any) => o.value?.id === item.id))}
onChange={(values: any) => {
let am = values && values.map((i: any) => i.value)
setFieldValue(field.name, am)
const am = values && values.map((i: any) => i.value);
setFieldValue(field.name, am);
}}
className="dark:bg-gray-700 dark"
/>
@ -103,8 +98,10 @@ interface DownloadClientSelectProps {
clients: DownloadClient[];
}
export default function DownloadClientSelect({
name, action, clients,
export function DownloadClientSelect({
name,
action,
clients
}: DownloadClientSelectProps) {
return (
<div className="col-span-6 sm:col-span-6">
@ -212,7 +209,12 @@ interface SelectFieldProps {
options: SelectFieldOption[];
}
function Select({ name, label, optionDefaultText, options }: SelectFieldProps) {
export const Select = ({
name,
label,
optionDefaultText,
options
}: SelectFieldProps) => {
return (
<div className="col-span-6">
<Field name={name} type="select">
@ -309,7 +311,12 @@ function Select({ name, label, optionDefaultText, options }: SelectFieldProps) {
);
}
function SelectWide({ name, label, optionDefaultText, options }: SelectFieldProps) {
export const SelectWide = ({
name,
label,
optionDefaultText,
options
}: SelectFieldProps) => {
return (
<div className="py-6 px-6 space-y-6 sm:py-0 sm:space-y-0 sm:divide-y sm:divide-gray-200">
@ -409,5 +416,3 @@ function SelectWide({ name, label, optionDefaultText, options }: SelectFieldProp
</div>
);
}
export { MultiSelect, Select, SelectWide, DownloadClientSelect, IndexerMultiSelect }