Skip to content

Commit 557f7e8

Browse files
PolymetaPolymeta
committed
re-introduce linting to ui package and run linter
1 parent 1c0488f commit 557f7e8

26 files changed

Lines changed: 157 additions & 113 deletions

‎packages/ui/eslint.config.mjs‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
import {config} from "eslint-config-custom/vue"
2+
3+
export default [
4+
...config,
5+
{
6+
"rules": {
7+
"@typescript-eslint/no-explicit-any": "warn",
8+
"vue/require-prop-types": "warn",
9+
"vue/valid-v-for": "warn"
10+
}
11+
}
12+
];

‎packages/ui/package.json‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,9 @@
3030
"test:unit": "vitest --ui --coverage",
3131
"build": "vite build",
3232
"build:watch": "vite build --watch",
33-
"preview": "vite preview"
33+
"preview": "vite preview",
34+
"lint": "eslint src",
35+
"lint:fix": "eslint src --fix"
3436
},
3537
"dependencies": {
3638
"@azure/abort-controller": "^2.0.0",

‎packages/ui/src/components/ForgeActionButton.vue‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -11,8 +11,8 @@ import { ref } from "vue";
1111
const loading = ref<boolean>(false)
1212
1313
export interface ForgeActionButtonProps extends /* @vue-ignore */ ButtonProps {
14-
action: Function,
15-
errorAction: Function,
14+
action: (...param: any[]) => Promise<void>,
15+
errorAction: (...param: any[]) => Promise<void>,
1616
errorParams?: Array<any>,
1717
params?: Array<any>
1818
}

‎packages/ui/src/components/ForgeAlert.vue‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<Message v-bind="{...$attrs, ...props}">
33
<template #icon>
44
<div :class="props.icon ? 'me-2 pe-1' : ''">
5-
<Icon data-cy="message-icon" v-if="props.icon" :icon="props.icon" :class="`text-${props.severity}`" :height="35" />
5+
<Icon v-if="props.icon" data-cy="message-icon" :icon="props.icon" :class="`text-${props.severity}`" :height="35" />
66
</div>
77
</template>
88
<slot/>

‎packages/ui/src/components/ForgeAutoComplete.vue‎

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,8 @@
11
<template>
2-
<AutoComplete v-bind="{ ...$attrs, ...$props }" inputClass="form-control border-0">
3-
<slot v-for="(_, name) in $slots" :slot="name" :name="name" />
2+
<AutoComplete v-bind="{ ...$attrs, ...$props }" input-class="form-control border-0">
3+
<template v-for="(_, name) in $slots" #[name]>
4+
<slot :name="name" />
5+
</template>
46
</AutoComplete>
57
</template>
68

‎packages/ui/src/components/ForgeCheckbox.vue‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,29 +3,29 @@
33
<div
44
class="d-flex"
55
data-cy="checkbox-container"
6-
@click="onChange(value)"
76
v-bind="{ ...$attrs }"
7+
@click="onChange(value)"
88
>
99
<Checkbox
1010
v-bind="{ ...props }"
11-
binary
1211
v-model="value"
12+
binary
1313
:input-id="props.name"
1414
:input-class="{ 'is-invalid': hasErrors }"
1515
:class="props.disabled ? '' : 'cursor-pointer'"
1616
/>
1717
<label
1818
:for="props.name"
19-
@click="onChange(!value)"
2019
:class="`${props.disabled ? 'opacity-50' : 'cursor-pointer'} ${
2120
hasErrors ? 'text-danger-dark' : ''
2221
}`"
2322
class="w-100 my-auto"
23+
@click="onChange(!value)"
2424
>
2525
<slot>{{ props.label }}</slot>
2626
</label>
2727
</div>
28-
<small data-cy="error" class="text-invalid" v-show="hasErrors">{{
28+
<small v-show="hasErrors" data-cy="error" class="text-invalid">{{
2929
errorMessage
3030
}}</small>
3131
</div>

‎packages/ui/src/components/ForgeChip.vue‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,8 @@
11
<template>
22
<Chip v-bind="{ ...$attrs, ...$props }" :pt="chipPt">
3-
<slot v-for="(_, name) in $slots" :slot="name" :name="name" />
3+
<template v-for="(_, name) in $slots" #[name]>
4+
<slot :name="name" />
5+
</template>
46
</Chip>
57
</template>
68

‎packages/ui/src/components/ForgeDatepicker.vue‎

Lines changed: 10 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -5,15 +5,18 @@
55
</span>
66

77
<div class="position-relative w-100">
8-
<DatePicker v-bind="{...props, ...$attrs}" :pt="pt" v-model="model" @update:model-value="handleChange"
9-
@blur="() => handleBlur" :input-class="{'datepicker-invalid': hasErrors}"/>
10-
<Icon data-cy="icon" icon="bi:calendar4" v-show="props.showIcon"
8+
<DatePicker
9+
v-bind="{...props, ...$attrs}" v-model="model" :pt="pt" :input-class="{'datepicker-invalid': hasErrors}"
10+
@update:model-value="handleChange" @blur="() => handleBlur"/>
11+
<Icon
12+
v-show="props.showIcon" data-cy="icon" icon="bi:calendar4"
1113
class="position-absolute end-0 top-50 bottom-50 my-auto me-2 bg-white"
1214
:class="`${ hasErrors ? 'text-danger-dark' : 'text-muted'}`"
1315
/>
14-
<Icon data-cy="icon" icon="bi:x" v-show="props.modelValue" @click="clear"
15-
class="position-absolute end-0 top-50 bottom-50 my-auto text-muted cursor-pointer bg-white"
16-
:class="props.showIcon ? 'datepicker-close-icon' : 'me-2'" />
16+
<Icon
17+
v-show="props.modelValue" data-cy="icon" icon="bi:x" class="position-absolute end-0 top-50 bottom-50 my-auto text-muted cursor-pointer bg-white"
18+
:class="props.showIcon ? 'datepicker-close-icon' : 'me-2'"
19+
@click="clear" />
1720
</div>
1821

1922

@@ -22,7 +25,7 @@
2225
</span>
2326
</div>
2427

25-
<small data-cy="error" class="text-invalid" v-show="hasErrors">{{ errorMessage }}</small>
28+
<small v-show="hasErrors" data-cy="error" class="text-invalid">{{ errorMessage }}</small>
2629
</template>
2730

2831
<script setup lang="ts">

‎packages/ui/src/components/ForgeForm.vue‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,8 @@
2121
Triggered when the cancel button is clicked
2222
@event cancel
2323
-->
24-
<Button v-if="!hideCancel" data-cy="cancel-btn" type="reset" severity="secondary" outlined
24+
<Button
25+
v-if="!hideCancel" data-cy="cancel-btn" type="reset" severity="secondary" outlined
2526
@click="$emit('cancel')">{{ cancelText }}
2627
</Button>
2728
</slot>
@@ -31,7 +32,7 @@
3132
</Button>
3233
</slot>
3334
</div>
34-
<forge-loader data-cy="loading-spinner" v-if="loading"/>
35+
<forge-loader v-if="loading" data-cy="loading-spinner"/>
3536
</form>
3637
</template>
3738

@@ -41,7 +42,7 @@ import ForgeAlert from "./ForgeAlert.vue";
4142
import ForgeLoader from "./ForgeLoader.vue";
4243
4344
export interface ForgeFormProps {
44-
onSubmit: Function,
45+
onSubmit: () => Promise<void>,
4546
title?: string,
4647
hideTitle?: boolean,
4748
titleClass?: string,

‎packages/ui/src/components/ForgeFormField.vue‎

Lines changed: 28 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,35 +1,44 @@
11
<template>
2-
<forge-checkbox :id="props.name" v-if="props.type === 'checkbox'" :label="props.fieldLabel" v-bind="$attrs"
3-
:name="props.name" v-model="model" />
4-
<div class="d-flex flex-column w-100" v-else>
2+
<forge-checkbox
3+
v-if="props.type === 'checkbox'" :id="props.name" v-bind="$attrs" v-model="model"
4+
:label="props.fieldLabel" :name="props.name" />
5+
<div v-else class="d-flex flex-column w-100">
56
<div data-cy="input-wrapper" class="d-flex" :class="props.fieldLabelPosition === 'top' ? 'flex-column' : 'flex-row'">
67
<label :for="props.name" :class="props.fieldLabelPosition === 'top' ? 'mb-1' : ('me-2 ' + props.labelWidthClass)">{{ props.fieldLabel }}</label>
7-
<input-number :id="props.name" v-if="props.type === 'number'" v-bind="$attrs"
8-
:placeholder="props.placeholder" :input-class="{'is-invalid': hasErrors }" :class="{'is-invalid': hasErrors }"
9-
v-model="model"
8+
<input-number
9+
v-if="props.type === 'number'" :id="props.name" v-bind="$attrs"
10+
v-model="model" :placeholder="props.placeholder" :input-class="{'is-invalid': hasErrors }"
11+
:class="{'is-invalid': hasErrors }"
1012
@input="change"
1113
/>
12-
<Textarea :id="props.name" v-else-if="props.type === 'textarea'" v-bind="$attrs"
13-
:placeholder="props.placeholder" :class="{'is-invalid': hasErrors }"
14-
v-model="model"
14+
<Textarea
15+
v-else-if="props.type === 'textarea'" :id="props.name" v-bind="$attrs"
16+
v-model="model" :placeholder="props.placeholder"
17+
:class="{'is-invalid': hasErrors }"
1518
@input="change" @blur="handleBlur"
1619
/>
17-
<InputMask :id="props.name" v-else-if="props.type === 'mask'" v-bind="$attrs"
18-
:placeholder="props.placeholder" :mask="props.mask" :class="{'is-invalid': hasErrors }"
19-
v-model="model" @complete="change" @blur="handleBlur"
20+
<InputMask
21+
v-else-if="props.type === 'mask'" :id="props.name" v-bind="$attrs"
22+
v-model="model" :placeholder="props.placeholder" :mask="props.mask"
23+
:class="{'is-invalid': hasErrors }" @complete="change" @blur="handleBlur"
2024
/>
21-
<InputText :id="props.name" v-else-if="props.type === 'text'" v-bind="$attrs"
22-
:placeholder="props.placeholder" :class="{'is-invalid': hasErrors }"
23-
v-model="model"
25+
<InputText
26+
v-else-if="props.type === 'text'" :id="props.name" v-bind="$attrs"
27+
v-model="model" :placeholder="props.placeholder"
28+
:class="{'is-invalid': hasErrors }"
2429
@input="change" @blur="handleBlur"
2530
/>
26-
<Select v-else-if="props.type === 'select'" v-bind="{...props,...$attrs}" v-model="model"
31+
<Select
32+
v-else-if="props.type === 'select'" v-bind="{...props,...$attrs}" v-model="model"
2733
:class="{'is-invalid': hasErrors }" />
28-
<MultiSelect v-else-if="props.type === 'multiselect'" v-bind="{...props,...$attrs}" v-model="model"
34+
<MultiSelect
35+
v-else-if="props.type === 'multiselect'" v-bind="{...props,...$attrs}" v-model="model"
2936
:class="{'is-invalid': hasErrors }" />
30-
<ForgeMultiSelectPreview v-else-if="props.type === 'multiselect-preview'" v-bind="{...props,...$attrs}" v-model="model"
37+
<ForgeMultiSelectPreview
38+
v-else-if="props.type === 'multiselect-preview'" v-bind="{...props,...$attrs}" v-model="model"
3139
:class="{'is-invalid': hasErrors }" />
32-
<ForgeDatepicker v-else-if="props.type === 'datepicker'" v-bind="{...props,...$attrs}" v-model="model"
40+
<ForgeDatepicker
41+
v-else-if="props.type === 'datepicker'" v-bind="{...props,...$attrs}" v-model="model"
3342
:class="{'is-invalid': hasErrors }"/>
3443
</div>
3544
<small v-show="hasErrors && props.type !== 'multiselect' && props.type !== 'datepicker'" data-cy="error" class="invalid-feedback">{{ errorMessage }}</small>
@@ -44,7 +53,6 @@ import { computed, watch } from "vue";
4453
import { ForgeFormFieldTypes } from "../types/forge-types";
4554
import ForgeMultiSelectPreview from "@/components/ForgeMultiSelectPreview.vue";
4655
47-
// @ts-ignore
4856
export interface ForgeFormFieldProps {
4957
name: string,
5058
fieldLabelPosition?: 'left' | 'top',

0 commit comments

Comments
 (0)