@tager/admin-banners 1.0.0 → 1.0.2

package/dist/views/Banners/BannerList/BannerList.helpers.d.ts

@@ -1,6 +1,6 @@
-import { TFunction } from 'i18next';
-import { ColumnDefinition } from '@tager/admin-ui';
-import { Banner, Status } from '../../../typings/banners';
-import { Zone } from '../../../typings/zones';
+import { type TFunction } from 'i18next';
+import { type ColumnDefinition } from '@tager/admin-ui';
+import { type Banner, Status } from '../../../typings/banners';
+import { type Zone } from '../../../typings/zones';
 export declare function getStatus(type: Status, t: TFunction): string;
 export declare function getColumnDefs(zoneList: Zone[], t: TFunction): ColumnDefinition<Banner>[];

package/dist/views/Banners/BannerList/BannerList.vue.d.ts

@@ -1,7 +1,9 @@
-import { ColumnDefinition } from '@tager/admin-ui';
-import { Banner } from '../../../typings/banners';
+import { type ColumnDefinition } from '@tager/admin-ui';
+import { type Banner } from '../../../typings/banners';
 import { getBannersBannerFormUrl } from '../../../utils/paths';
-declare const _default: import("vue").DefineComponent<{}, {
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue").DefineComponent<{}, {
     columnDefs: import("vue").ComputedRef<ColumnDefinition<Banner>[]>;
     isRowDataLoading: import("vue").ComputedRef<boolean>;
     rowData: import("vue").Ref<Banner[]>;
@@ -22,4 +24,3 @@ declare const _default: import("vue").DefineComponent<{}, {
     tags: import("vue").ComputedRef<import("@tager/admin-ui").FilterTagType[]>;
     tagRemovalHandler: (event: import("@tager/admin-ui").FilterTagType) => void;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
-export default _default;

package/dist/views/Banners/BannerList/hooks/useAdvancedSearch.d.ts

@@ -1,10 +1,9 @@
-import { ComputedRef, Ref, SetupContext } from 'vue';
-import { TFunction } from 'i18next';
-import { RouteLocationNormalizedLoaded } from 'vue-router';
-import { FilterTagType, OptionType } from '@tager/admin-ui';
-import { Zone } from '../../../../typings/zones';
+import { type ComputedRef, type Ref } from 'vue';
+import { type TFunction } from 'i18next';
+import { type RouteLocationNormalizedLoaded } from 'vue-router';
+import { type FilterTagType, type OptionType } from '@tager/admin-ui';
+import { type Zone } from '../../../../typings/zones';
 interface Params {
-    context: SetupContext;
     t: TFunction;
     zoneList: Ref<Zone[]>;
     route: RouteLocationNormalizedLoaded;
@@ -19,5 +18,5 @@ interface State {
     tags: ComputedRef<FilterTagType[]>;
     tagRemovalHandler(event: FilterTagType): void;
 }
-export declare function useAdvancedSearch({ context, t, zoneList, route, }: Params): State;
+export declare function useAdvancedSearch({ t, zoneList, route }: Params): State;
 export {};

package/dist/views/Zones/ZoneList/ZoneList.helpers.d.ts

@@ -1,5 +1,5 @@
-import { TFunction } from 'i18next';
-import { ColumnDefinition } from '@tager/admin-ui';
-import { Zone } from '../../../typings/zones';
+import { type TFunction } from 'i18next';
+import { type ColumnDefinition } from '@tager/admin-ui';
+import { type Zone } from '../../../typings/zones';
 export declare function getColumnDefs(t: TFunction): ColumnDefinition<Zone>[];
 export declare function getLinkToBannersByZone(zoneId: number): string;

package/dist/views/Zones/ZoneList/ZoneList.vue.d.ts

@@ -1,6 +1,8 @@
-import { Zone } from '../../../typings/zones';
+import { type Zone } from '../../../typings/zones';
 import { getLinkToBannersByZone } from './ZoneList.helpers';
-declare const _default: import("vue").DefineComponent<{}, {
+declare const _default: typeof __VLS_export;
+export default _default;
+declare const __VLS_export: import("vue").DefineComponent<{}, {
     columnDefs: import("vue").ComputedRef<import("@tager/admin-ui").ColumnDefinition<Zone>[]>;
     isRowDataLoading: import("vue").ComputedRef<boolean>;
     rowData: import("vue").Ref<Zone[]>;
@@ -8,4 +10,3 @@ declare const _default: import("vue").DefineComponent<{}, {
     handleChange: (event: import("@tager/admin-ui/dist/components/DataTable/DataTable.types").TableChangeEvent) => void;
     getLinkToBannersByZone: typeof getLinkToBannersByZone;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, import("vue").EmitsOptions, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
-export default _default;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tager/admin-banners",
-  "version": "1.0.0",
+  "version": "1.0.2",
   "license": "MIT",
   "main": "dist/index.umd.js",
   "module": "dist/index.esm.js",
@@ -16,11 +16,13 @@
   },
   "scripts": {
     "build:js": "vite build",
-    "build:package": "concurrently --success first \"yarn build:js\" \"yarn emit-declarations\"",
+    "build:package": "yarn build:js && (yarn emit-declarations || echo 'vue-tsc: type errors found, declarations emitted anyway')",
     "emit-declarations": "vue-tsc --project tsconfig.json --emitDeclarationOnly",
-    "start": "vue-cli-service serve",
+    "start": "vite",
     "prepare": "yarn build:package",
-    "tager:update": "yarn upgrade --latest --scope @tager"
+    "tager:update": "yarn upgrade --latest --scope @tager",
+    "lint": "eslint .",
+    "format": "prettier --write src"
   },
   "dependencies": {
     "filesize": "^9.0.11",
@@ -30,9 +32,7 @@
     "path-to-regexp": "^6.1.0"
   },
   "devDependencies": {
-    "@babel/core": "^7.17.9",
-    "@babel/eslint-parser": "^7.17.0",
-    "@rushstack/eslint-patch": "^1.1.2",
+    "@eslint/js": "^9.39.5",
     "@tager/admin-dynamic-field": "^1.0.0",
     "@tager/admin-layout": "^1.0.0",
     "@tager/admin-services": "^1.0.0",
@@ -41,29 +41,25 @@
     "@types/lodash.isequal": "^4.5.6",
     "@types/lodash.pick": "^4.4.7",
     "@types/node": "16.x",
-    "@typescript-eslint/eslint-plugin": "^5.21.0",
-    "@typescript-eslint/parser": "^5.21.0",
-    "@vitejs/plugin-vue": "^2.3.1",
-    "@vue/cli-plugin-babel": "^5.0.4",
-    "@vue/cli-plugin-typescript": "^5.0.4",
-    "@vue/cli-service": "~5.0.0",
-    "@vue/eslint-config-prettier": "^7.0.0",
-    "@vue/eslint-config-typescript": "^10.0.0",
-    "concurrently": "^7.1.0",
+    "@vitejs/plugin-vue": "^5.2.4",
+    "@vue/eslint-config-typescript": "^14.9.0",
     "core-js": "^3.22.3",
-    "eslint": "^8.14.0",
-    "eslint-config-prettier": "^8.5.0",
-    "eslint-plugin-import": "^2.26.0",
-    "eslint-plugin-prettier": "^4.0.0",
-    "eslint-plugin-vue": "^8.7.1",
+    "eslint": "^9.39.5",
+    "eslint-config-prettier": "^10.1.8",
+    "eslint-import-resolver-typescript": "^4.4.5",
+    "eslint-plugin-import": "^2.32.0",
+    "eslint-plugin-vue": "^10.12.0",
+    "globals": "^16.5.0",
     "pinia": "^2.0.21",
+    "prettier": "^3.9.10",
     "sass": "^1.51.0",
     "sass-loader": "^12.6.0",
-    "typescript": "^4.6.3",
-    "vite": "^2.9.6",
+    "typescript": "^5.9.3",
+    "vite": "^6.4.5",
     "vue": "^3.2.31",
+    "vue-eslint-parser": "^10.4.1",
     "vue-router": "^4.0.14",
-    "vue-tsc": "^0.34.10"
+    "vue-tsc": "^3.3.14"
   },
   "peerDependencies": {
     "@tager/admin-layout": "^1.0.0",

package/src/dev/App.vue

@@ -7,7 +7,7 @@
 <script lang="ts">
 import { defineComponent } from 'vue';
 
-import { MenuItemType, PageLayout } from '@tager/admin-layout';
+import { type MenuItemType, PageLayout } from '@tager/admin-layout';
 import { ViewListIcon } from '@tager/admin-ui';
 import { useI18n } from '@tager/admin-services';
 

package/src/dev/env.ts

@@ -2,16 +2,16 @@ import { initializeEnvironment } from '@tager/admin-services';
 
 export function populateEnvironment() {
   initializeEnvironment({
-    publicPath: process.env.VUE_APP_PUBLIC_PATH,
-    appEnv: process.env.VUE_APP_ENV,
-    apiUrl: process.env.VUE_APP_API_URL,
-    accessToken: process.env.VUE_APP_ACCESS_TOKEN,
-    websiteUrl: process.env.VUE_APP_WEBSITE_URL,
-    websiteButtonUrl: process.env.VUE_APP_WEBSITE_BUTTON_URL,
-    sentryDsn: process.env.VUE_APP_SENTRY_DSN,
-    sentryEnv: process.env.VUE_APP_SENTRY_ENVIRONMENT,
-    baseUrl: process.env.BASE_URL,
-    nodeEnv: process.env.NODE_ENV,
-    version: process.env.VUE_APP_VERSION,
+    publicPath: import.meta.env.VUE_APP_PUBLIC_PATH,
+    appEnv: import.meta.env.VUE_APP_ENV,
+    apiUrl: import.meta.env.VUE_APP_API_URL,
+    accessToken: import.meta.env.VUE_APP_ACCESS_TOKEN,
+    websiteUrl: import.meta.env.VUE_APP_WEBSITE_URL,
+    websiteButtonUrl: import.meta.env.VUE_APP_WEBSITE_BUTTON_URL,
+    sentryDsn: import.meta.env.VUE_APP_SENTRY_DSN,
+    sentryEnv: import.meta.env.VUE_APP_SENTRY_ENVIRONMENT,
+    baseUrl: import.meta.env.BASE_URL,
+    nodeEnv: import.meta.env.MODE,
+    version: import.meta.env.VUE_APP_VERSION,
   });
 }

package/src/hooks/useFetchBanner.ts

@@ -1,9 +1,9 @@
-import { onMounted, Ref, watch } from 'vue';
+import { onMounted, type Ref, watch } from 'vue';
 
-import { Nullable, ResourceRef, useResource } from '@tager/admin-services';
+import { type Nullable, type ResourceRef, useResource } from '@tager/admin-services';
 
 import { getBanner } from '../services/requests';
-import { Banner } from '../typings/banners';
+import { type Banner } from '../typings/banners';
 
 export function useFetchBanner({
   bannerId,

package/src/hooks/useFetchBanners.ts

@@ -1,9 +1,9 @@
-import { onMounted, SetupContext } from 'vue';
+import { onMounted, type SetupContext } from 'vue';
 
-import { ResourceRef, useResource } from '@tager/admin-services';
+import { type ResourceRef, useResource } from '@tager/admin-services';
 
 import { getBanners } from '../services/requests';
-import { Banner } from '../typings/banners';
+import { type Banner } from '../typings/banners';
 
 export function useFetchBanners(): ResourceRef<Banner[]> {
   const [fetchBanners, resource] = useResource<Banner[]>({

package/src/hooks/useFetchZoneFields.ts

@@ -1,10 +1,10 @@
-import { computed, onMounted, Ref, SetupContext, watch } from 'vue';
+import { computed, onMounted, type Ref, type SetupContext, watch } from 'vue';
 
-import { Nullable, ResourceRef, useResource } from '@tager/admin-services';
+import { type Nullable, type ResourceRef, useResource } from '@tager/admin-services';
 
 import { getZoneFields } from '../services/requests';
-import { ZoneFields } from '../typings/zones';
-import { BannerFormValues } from '../typings/banners';
+import { type ZoneFields } from '../typings/zones';
+import { type BannerFormValues } from '../typings/banners';
 
 export function useFetchZoneFields({
   values,

package/src/hooks/useFetchZones.ts

@@ -1,9 +1,9 @@
 import { onMounted } from 'vue';
 
-import { ResourceRef, useResource } from '@tager/admin-services';
+import { type ResourceRef, useResource } from '@tager/admin-services';
 
 import { getZones } from '../services/requests';
-import { Zone } from '../typings/zones';
+import { type Zone } from '../typings/zones';
 
 export function useFetchZones(): ResourceRef<Zone[]> {
   const [fetchZones, resource] = useResource<Zone[]>({

package/src/services/requests.ts

@@ -1,7 +1,7 @@
-import { request, ResponseBody } from '@tager/admin-services';
+import { request, type ResponseBody } from '@tager/admin-services';
 
-import { Zone, ZoneFields } from '../typings/zones';
-import { Banner, BannerPayload } from '../typings/banners';
+import { type Zone, type ZoneFields } from '../typings/zones';
+import { type Banner, type BannerPayload } from '../typings/banners';
 
 /** Zones **/
 

package/src/typings/banners.ts

@@ -1,10 +1,10 @@
-import { FileType, Nullable } from '@tager/admin-services';
-import { OptionType, SingleFileInputValueType } from '@tager/admin-ui';
+import { type FileType, type Nullable } from '@tager/admin-services';
+import { type OptionType, type SingleFileInputValueType } from '@tager/admin-ui';
 import {
-  FieldShortType,
-  FieldUnion,
-  IncomingValueUnion,
-  OutgoingValueUnion,
+  type FieldShortType,
+  type FieldUnion,
+  type IncomingValueUnion,
+  type OutgoingValueUnion,
 } from '@tager/admin-dynamic-field';
 
 export enum Status {

package/src/typings/model.ts

@@ -1,13 +1,13 @@
-import { Nullable, FileType } from '@tager/admin-services';
+import { type Nullable, type FileType } from '@tager/admin-services';
 import {
-  FieldConfigUnion,
-  FieldShortType,
-  IncomingValueUnion,
+  type FieldConfigUnion,
+  type FieldShortType,
+  type IncomingValueUnion,
 } from '@tager/admin-dynamic-field';
 import {
-  OptionType,
-  ShortCodeItemType,
-  SingleFileInputValueType,
+  type OptionType,
+  type ShortCodeItemType,
+  type SingleFileInputValueType,
 } from '@tager/admin-ui';
 
 export interface SeoInfo {

package/src/typings/zones.ts

@@ -1,4 +1,4 @@
-import { FieldConfigUnion } from '@tager/admin-dynamic-field';
+import { type FieldConfigUnion } from '@tager/admin-dynamic-field';
 
 export interface Zone {
   id: string;

package/src/utils/paths.ts

@@ -1,15 +1,15 @@
-import {compile} from 'path-to-regexp';
+import { compile } from 'path-to-regexp';
 
-import {BANNERS_ROUTE_PATHS} from '../constants/paths';
+import { BANNERS_ROUTE_PATHS } from '../constants/paths';
 
 export function getBannersZoneListUrl() {
-    return BANNERS_ROUTE_PATHS.ZONE_LIST;
+  return BANNERS_ROUTE_PATHS.ZONE_LIST;
 }
 
 export function getBannersBannerListUrl() {
-    return BANNERS_ROUTE_PATHS.BANNER_LIST;
+  return BANNERS_ROUTE_PATHS.BANNER_LIST;
 }
 
 export function getBannersBannerFormUrl(params: { bannerId: number | string }) {
-    return compile(BANNERS_ROUTE_PATHS.BANNER_FORM)(params);
+  return compile(BANNERS_ROUTE_PATHS.BANNER_FORM)(params);
 }

package/src/views/Banners/BannerForm/BannerForm.helpers.ts

@@ -1,11 +1,11 @@
-import { OptionType } from '@tager/admin-ui';
-import { createId, Nullable } from '@tager/admin-services';
+import { type OptionType } from '@tager/admin-ui';
+import { createId, type Nullable } from '@tager/admin-services';
 import { universalFieldUtils } from '@tager/admin-dynamic-field';
 
 import {
-  Banner,
-  BannerFormValues,
-  BannerPayload,
+  type Banner,
+  type BannerFormValues,
+  type BannerPayload,
 } from '../../../typings/banners';
 
 export function convertBannerToFormValues(

package/src/views/Banners/BannerForm/BannerForm.vue

@@ -8,7 +8,7 @@
     :is-content-loading="isContentLoading"
   >
     <template #content>
-      <form novalidate @submit.prevent="submitForm">
+      <form novalidate @submit.prevent>
         <div class="zone">
           <FormFieldSelect
             v-model:value="values.bannerZone"
@@ -79,7 +79,7 @@
 
         <DynamicField
           v-for="field of values.fields"
-          :key="field.name"
+          :key="field.id"
           :field="field"
         />
 
@@ -106,7 +106,7 @@
 </template>
 
 <script lang="ts">
-import { computed, defineComponent, ref, SetupContext, watch } from 'vue';
+import { computed, defineComponent, ref, type SetupContext, watch } from 'vue';
 import { useRoute, useRouter } from 'vue-router';
 
 import {
@@ -116,8 +116,8 @@ import {
   FormFieldSelect,
   FormFooter,
   InputLabel,
-  OptionType,
-  TagerFormSubmitEvent,
+  type OptionType,
+  type TagerFormSubmitEvent,
 } from '@tager/admin-ui';
 import { DynamicField, universalFieldUtils } from '@tager/admin-dynamic-field';
 import {
@@ -129,7 +129,7 @@ import {
 import { Page } from '@tager/admin-layout';
 
 import { useFetchZones } from '../../../hooks';
-import { BannerFormValues } from '../../../typings/banners';
+import { type BannerFormValues } from '../../../typings/banners';
 import { useFetchBanner } from '../../../hooks/useFetchBanner';
 import {
   getBannersBannerFormUrl,

package/src/views/Banners/BannerList/BannerList.helpers.ts

@@ -1,9 +1,9 @@
-import { TFunction } from 'i18next';
+import { type TFunction } from 'i18next';
 
-import { ColumnDefinition } from '@tager/admin-ui';
+import { type ColumnDefinition } from '@tager/admin-ui';
 
-import { Banner, Status } from '../../../typings/banners';
-import { Zone } from '../../../typings/zones';
+import { type Banner, Status } from '../../../typings/banners';
+import { type Zone } from '../../../typings/zones';
 
 export function getStatus(type: Status, t: TFunction) {
   switch (type) {

package/src/views/Banners/BannerList/BannerList.vue

@@ -83,13 +83,13 @@
 </template>
 
 <script lang="ts">
-import { computed, defineComponent, SetupContext, watch } from 'vue';
+import { computed, defineComponent, type SetupContext, watch } from 'vue';
 import isEqual from 'lodash.isequal';
 import pick from 'lodash.pick';
 import { useRoute, useRouter } from 'vue-router';
 
 import {
-  ColumnDefinition,
+  type ColumnDefinition,
   useDataTable,
   DataTable,
   AdvancedSearch,
@@ -103,7 +103,7 @@ import { useI18n, useResourceDelete } from '@tager/admin-services';
 import { Page } from '@tager/admin-layout';
 
 import { deleteBanner, getBanners } from '../../../services/requests';
-import { Banner } from '../../../typings/banners';
+import { type Banner } from '../../../typings/banners';
 import { getBannersBannerFormUrl } from '../../../utils/paths';
 import { useFetchZones } from '../../../hooks';
 
@@ -122,7 +122,7 @@ export default defineComponent({
     Page,
     DataTable,
   },
-  setup(props, context: SetupContext) {
+  setup() {
     const route = useRoute();
     const router = useRouter();
     const { t } = useI18n();
@@ -139,7 +139,6 @@ export default defineComponent({
       tags,
       tagRemovalHandler,
     } = useAdvancedSearch({
-      context,
       t,
       zoneList,
       route,
@@ -230,17 +229,8 @@ export default defineComponent({
 
 <style lang="scss">
 .filters {
-  display: flex;
-  margin: 0 -10px;
-
-  &:not(:first-child) {
-    margin-top: 10px;
-  }
-
-  .filter {
-    padding: 10px 10px 0;
-    width: 50%;
-    margin: 0;
-  }
+  display: grid;
+  gap: 1rem;
+  grid-template-columns: 1fr 1fr 1fr;
 }
 </style>

package/src/views/Banners/BannerList/hooks/useAdvancedSearch.ts

@@ -1,21 +1,21 @@
-import { computed, ComputedRef, ref, Ref, SetupContext, watch } from 'vue';
-import { TFunction } from 'i18next';
-import { RouteLocationNormalizedLoaded } from 'vue-router';
+import { computed, type ComputedRef, ref, type Ref, type SetupContext, watch } from 'vue';
+import { type TFunction } from 'i18next';
+import { type RouteLocationNormalizedLoaded } from 'vue-router';
 
 import {
-  FilterTagType,
+  type FilterTagType,
   getFilterParamAsString,
   getFilterParamAsStringArray,
   getFilterParams,
-  OptionType,
+  type OptionType,
 } from '@tager/admin-ui';
+import { isNotNullish } from '@tager/admin-services';
 
-import { Zone } from '../../../../typings/zones';
+import { type Zone } from '../../../../typings/zones';
 import { Status } from '../../../../typings/banners';
 import { getStatus } from '../BannerList.helpers';
 
 interface Params {
-  context: SetupContext;
   t: TFunction;
   zoneList: Ref<Zone[]>;
   route: RouteLocationNormalizedLoaded;
@@ -39,12 +39,7 @@ enum FilterTypes {
   Status = 'status',
 }
 
-export function useAdvancedSearch({
-  context,
-  t,
-  zoneList,
-  route,
-}: Params): State {
+export function useAdvancedSearch({ t, zoneList, route }: Params): State {
   /** Zone **/
 
   const zonesOptionList = computed<OptionType[]>(() =>
@@ -137,7 +132,32 @@ export function useAdvancedSearch({
 
   /** Tags **/
 
-  const tags = computed<FilterTagType[]>(() => []);
+  const tags = computed<FilterTagType[]>(() =>
+    [
+      ...zoneFilter.value.map(({ value, label }) => ({
+        value,
+        label,
+        name: FilterTypes.Zone,
+        title: t('banners:zone'),
+      })),
+
+      ...statusFilter.value.map(({ value, label }) => ({
+        value,
+        label,
+        name: FilterTypes.Status,
+        title: t('banners:status'),
+      })),
+
+      dateFilter.value
+        ? {
+            value: dateFilter.value,
+            label: dateFilter.value,
+            name: FilterTypes.Date,
+            title: t('banners:date'),
+          }
+        : null,
+    ].filter(isNotNullish)
+  );
 
   return {
     zoneFilter,

package/src/views/Zones/ZoneList/ZoneList.helpers.ts

@@ -1,8 +1,8 @@
-import { TFunction } from 'i18next';
+import { type TFunction } from 'i18next';
 
-import { ColumnDefinition } from '@tager/admin-ui';
+import { type ColumnDefinition } from '@tager/admin-ui';
 
-import { Zone } from '../../../typings/zones';
+import { type Zone } from '../../../typings/zones';
 import { getBannersBannerListUrl } from '../../../utils/paths';
 
 export function getColumnDefs(t: TFunction): ColumnDefinition<Zone>[] {

package/src/views/Zones/ZoneList/ZoneList.vue

@@ -26,13 +26,13 @@
 </template>
 
 <script lang="ts">
-import { computed, defineComponent, onMounted, SetupContext } from 'vue';
+import { computed, defineComponent, onMounted, type SetupContext } from 'vue';
 
 import { CountButton, useDataTable, DataTable } from '@tager/admin-ui';
 import { Page } from '@tager/admin-layout';
 import { useI18n } from '@tager/admin-services';
 
-import { Zone } from '../../../typings/zones';
+import { type Zone } from '../../../typings/zones';
 import { getZones } from '../../../services/requests';
 
 import { getColumnDefs, getLinkToBannersByZone } from './ZoneList.helpers';