@vc-shell/create-vc-app 1.0.130 → 1.0.132

package/CHANGELOG.md

@@ -1,3 +1,16 @@
+## [1.0.132](https://github.com/VirtoCommerce/vc-shell/compare/v1.0.131...v1.0.132) (2023-12-28)
+
+
+### Features
+
+* **create-vc-app:** strict types ([f336f8d](https://github.com/VirtoCommerce/vc-shell/commit/f336f8daaddd5268f0c68a625bcb1dc7719f542f))
+
+
+
+## [1.0.131](https://github.com/VirtoCommerce/vc-shell/compare/v1.0.130...v1.0.131) (2023-12-28)
+
+
+
 ## [1.0.130](https://github.com/VirtoCommerce/vc-shell/compare/v1.0.129...v1.0.130) (2023-12-27)
 
 

package/dist/templates/base/package.json

@@ -11,7 +11,8 @@
     "build:types": "vue-tsc --declaration --emitDeclarationOnly --outDir dist/types",
     "type-check": "vue-tsc --noEmit",
     "lint-staged": "lint-staged",
-    "generate:api-client": "cross-env api-client-generator --color -- APP_PLATFORM_MODULES='[]' APP_API_CLIENT_DIRECTORY=./src/api_client/",
+    "lint": "eslint --fix --cache '**/*.{ts,vue}'",
+    "generate:api-client": "cross-env api-client-generator --APP_PLATFORM_MODULES='[]' --APP_API_CLIENT_DIRECTORY=./src/api_client/",
     "release": "tsx scripts/release.ts --dry"
   },
   "devDependencies": {
@@ -22,9 +23,9 @@
     "@types/lodash-es": "^4.17.7",
     "@typescript-eslint/eslint-plugin": "^6.13.2",
     "@typescript-eslint/parser": "^6.13.2",
-    "@vc-shell/api-client-generator": "^1.0.130",
-    "@vc-shell/release-config": "^1.0.128",
-    "@vc-shell/ts-config": "^1.0.130",
+    "@vc-shell/api-client-generator": "^1.0.132",
+    "@vc-shell/release-config": "^1.0.132",
+    "@vc-shell/ts-config": "^1.0.132",
     "@vitejs/plugin-vue": "^4.5.1",
     "@vue/eslint-config-prettier": "^8.0.0",
     "@vue/eslint-config-typescript": "^12.0.0",
@@ -55,8 +56,8 @@
   },
   "dependencies": {
     "@fortawesome/fontawesome-free": "^5.15.3",
-    "@vc-shell/config-generator": "^1.0.130",
-    "@vc-shell/framework": "^1.0.130",
+    "@vc-shell/config-generator": "^1.0.132",
+    "@vc-shell/framework": "^1.0.132",
     "@vueuse/core": "^10.7.0",
     "@vueuse/integrations": "^10.7.0",
     "moment": "^2.29.4",
@@ -66,7 +67,8 @@
     "vue-router": "^4.2.5"
   },
   "lint-staged": {
-    "*.{js,ts,vue}": "eslint --fix"
+    "*.{js,ts,html,css}": "prettier --write '**/*.{ts,vue}'",
+    "*.{js,ts,vue}": "eslint --fix --cache '**/*.{ts,vue}'"
   },
   "packageManager": "yarn@3.6.4"
 }

package/dist/templates/variants/both/src/main.ts

@@ -33,7 +33,7 @@ async function startApp() {
   });
 
   app.config.errorHandler = (err) => {
-    notification.error(err.toString(), {
+    notification.error((err as Error).toString(), {
       timeout: 5000,
     });
   };

package/dist/templates/variants/both/src/modules/classic-module/composables/useDetails/index.ts

@@ -1,17 +1,17 @@
 /* eslint-disable import/no-unresolved */
-import { computed, ref } from "vue";
+import { Ref, computed, ref } from "vue";
 import img1 from "/assets/1.jpeg";
 import img2 from "/assets/2.jpg";
 import img3 from "/assets/3.jpg";
 import { useAsync, useLoading } from "@vc-shell/framework";
 
 export default () => {
-  const item = ref({
-    imgSrc: undefined,
-    name: undefined,
-    createdDate: undefined,
-    id: undefined,
-  });
+  const item = ref({}) as Ref<{
+    imgSrc: string;
+    name: string;
+    createdDate: Date;
+    id: string;
+  }>;
 
   // Example mocked method for 'fetching' list data
   const { loading: itemLoading, action: getItem } = useAsync<{ id: string }>(async (payload) => {
@@ -36,8 +36,10 @@ export default () => {
             createdDate: new Date(),
             id: "item-id-3",
           },
-        ].find((x) => x.id === payload.id);
-        resolve(findMockedItem);
+        ].find((x) => x.id === payload?.id);
+        if (findMockedItem) {
+          resolve(findMockedItem);
+        }
       }, 1000);
     });
   });

package/dist/templates/variants/both/src/modules/classic-module/composables/useList/index.ts

@@ -1,12 +1,19 @@
 /* eslint-disable import/no-unresolved */
-import { computed, ref } from "vue";
+import { Ref, computed, ref } from "vue";
 import img1 from "/assets/1.jpeg";
 import img2 from "/assets/2.jpg";
 import img3 from "/assets/3.jpg";
 import { useAsync, useLoading } from "@vc-shell/framework";
 
 export default () => {
-  const data = ref([]);
+  const data = ref([]) as Ref<
+    {
+      imgSrc: string;
+      name: string;
+      createdDate: Date;
+      id: string;
+    }[]
+  >;
 
   // Example mocked method for 'fetching' list data
   const { loading: itemLoading, action: getItems } = useAsync(async (payload) => {
@@ -33,7 +40,7 @@ export default () => {
               id: "item-id-3",
             },
           ]),
-        1000
+        1000,
       );
     });
   });

package/dist/templates/variants/both/src/modules/classic-module/locales/en.json

@@ -37,6 +37,9 @@
         "MOBILE": {
           "CREATED": "Created"
         }
+      },
+      "ALERTS": {
+        "CLOSE_CONFIRMATION": "You have unsaved changes\nClose anyway?"
       }
     }
   }

package/dist/templates/variants/both/src/modules/classic-module/pages/details.vue

@@ -69,7 +69,9 @@ const bladeToolbar = ref<IBladeToolbar[]>([
     title: computed(() => t("MODULE.PAGES.LIST.TOOLBAR.REFRESH")),
     icon: "fas fa-sync-alt",
     async clickHandler() {
-      await getItem({ id: props.param });
+      if (props.param) {
+        await getItem({ id: props.param });
+      }
     },
   },
 ]);

package/dist/templates/variants/both/src/modules/classic-module/pages/list.vue

@@ -87,7 +87,7 @@ export interface Emits {
   (event: "parent:call", args: IParentCallArgs): void;
   (event: "collapse:blade"): void;
   (event: "expand:blade"): void;
-  (event: "open:blade", blade: IBladeEvent);
+  (event: "open:blade", blade: IBladeEvent): void;
   (event: "close:blade"): void;
 }
 
@@ -96,10 +96,10 @@ defineOptions({
   name: "ClassicModuleList",
   isWorkspace: true,
   menuItem: {
-    title: 'MODULE.MENU.TITLE',
+    title: "MODULE.MENU.TITLE",
     icon: "fas fa-file-alt",
     priority: 1,
-  }
+  },
 });
 
 const props = withDefaults(defineProps<Props>(), {
@@ -135,7 +135,7 @@ watch(
       });
     }
   },
-  { immediate: true }
+  { immediate: true },
 );
 
 onMounted(async () => {
@@ -247,7 +247,7 @@ const onHeaderClick = (item: ITableColumns) => {
   }
 };
 
-const actionBuilder = (item: { status: string }): IActionBuilderResult[] => {
+const actionBuilder = (item: (typeof data.value)[number]): IActionBuilderResult[] => {
   const result = [];
 
   result.push({
@@ -255,7 +255,9 @@ const actionBuilder = (item: { status: string }): IActionBuilderResult[] => {
     title: "Delete",
     variant: "danger",
     leftActions: true,
-    // clickHandler() {},
+    clickHandler() {
+      throw new Error("Function is not implemented.");
+    },
   });
 
   return result;

package/dist/templates/variants/both/src/modules/dynamic-module/composables/useDetails/index.ts

@@ -3,12 +3,7 @@ import { computed, ref, Ref } from "vue";
 import img1 from "/assets/1.jpeg";
 import img2 from "/assets/2.jpg";
 import img3 from "/assets/3.jpg";
-import {
-  DetailsBaseBladeScope,
-  DynamicBladeForm,
-  IBladeToolbar,
-  useDetailsFactory,
-} from "@vc-shell/framework";
+import { DetailsBaseBladeScope, DynamicBladeForm, IBladeToolbar, useDetailsFactory } from "@vc-shell/framework";
 
 export interface DynamicItemScope extends DetailsBaseBladeScope {
   toolbarOverrides: {
@@ -44,7 +39,7 @@ export default (args: {
               createdDate: new Date(),
               id: "item-id-3",
             },
-          ].find((x) => x.id === payload.id);
+          ].find((x) => x.id === payload?.id);
           resolve(findMockedItem);
         }, 1000);
       });
@@ -59,18 +54,13 @@ export default (args: {
 
   const { load, saveChanges, remove, loading, item, validationState } = factory();
 
-  // const item = ref({
-  //   imgSrc: undefined,
-  //   name: undefined,
-  //   createdDate: undefined,
-  //   id: undefined,
-  // });
-
   const scope = ref<DynamicItemScope>({
     toolbarOverrides: {
       refresh: {
         async clickHandler() {
-          await load({ id: args.props.param });
+          if (args.props.param) {
+            await load({ id: args.props.param });
+          }
         },
       },
     },

package/dist/templates/variants/both/src/modules/dynamic-module/composables/useList/index.ts

@@ -5,6 +5,13 @@ import img2 from "/assets/2.jpg";
 import img3 from "/assets/3.jpg";
 import { DynamicBladeList, ListBaseBladeScope, useBladeNavigation, useListFactory } from "@vc-shell/framework";
 
+interface MockedItem {
+  imgSrc: string;
+  name: string;
+  createdDate: Date;
+  id: string;
+}
+
 // eslint-disable-next-line @typescript-eslint/no-empty-interface
 export interface DynamicItemsScope extends ListBaseBladeScope {}
 
@@ -15,7 +22,7 @@ export default (args: {
 }) => {
   const factory = useListFactory({
     load: async () => {
-      return await new Promise((resolve) => {
+      return await new Promise((resolve: (value: MockedItem[]) => void) => {
         setTimeout(
           () =>
             resolve([
@@ -38,9 +45,9 @@ export default (args: {
                 id: "item-id-3",
               },
             ]),
-          1000
+          1000,
         );
-      }).then((res: any[]) => {
+      }).then((res) => {
         return { results: res, totalCount: res.length };
       });
     },

package/dist/templates/variants/both/src/modules/dynamic-module/locales/en.json

@@ -40,6 +40,9 @@
         "EMPTY": {
           "NO_ITEMS": "There are no items yet"
         }
+      },
+      "ALERTS": {
+        "CLOSE_CONFIRMATION": "You have unsaved changes\nClose anyway?"
       }
     }
   }

package/dist/templates/variants/classic/src/main.ts

@@ -30,7 +30,7 @@ async function startApp() {
   });
 
   app.config.errorHandler = (err) => {
-    notification.error(err.toString(), {
+    notification.error((err as Error).toString(), {
       timeout: 5000,
     });
   };

package/dist/templates/variants/classic/src/modules/classic-module/composables/useDetails/index.ts

@@ -1,17 +1,17 @@
 /* eslint-disable import/no-unresolved */
-import { computed, ref } from "vue";
+import { Ref, computed, ref } from "vue";
 import img1 from "/assets/1.jpeg";
 import img2 from "/assets/2.jpg";
 import img3 from "/assets/3.jpg";
 import { useAsync, useLoading } from "@vc-shell/framework";
 
 export default () => {
-  const item = ref({
-    imgSrc: undefined,
-    name: undefined,
-    createdDate: undefined,
-    id: undefined,
-  });
+  const item = ref({}) as Ref<{
+    imgSrc: string;
+    name: string;
+    createdDate: Date;
+    id: string;
+  }>;
 
   // Example mocked method for 'fetching' list data
   const { loading: itemLoading, action: getItem } = useAsync<{ id: string }>(async (payload) => {
@@ -36,8 +36,10 @@ export default () => {
             createdDate: new Date(),
             id: "item-id-3",
           },
-        ].find((x) => x.id === payload.id);
-        resolve(findMockedItem);
+        ].find((x) => x.id === payload?.id);
+        if (findMockedItem) {
+          resolve(findMockedItem);
+        }
       }, 1000);
     });
   });

package/dist/templates/variants/classic/src/modules/classic-module/composables/useList/index.ts

@@ -1,12 +1,19 @@
 /* eslint-disable import/no-unresolved */
-import { computed, ref } from "vue";
+import { Ref, computed, ref } from "vue";
 import img1 from "/assets/1.jpeg";
 import img2 from "/assets/2.jpg";
 import img3 from "/assets/3.jpg";
 import { useAsync, useLoading } from "@vc-shell/framework";
 
 export default () => {
-  const data = ref([]);
+  const data = ref([]) as Ref<
+    {
+      imgSrc: string;
+      name: string;
+      createdDate: Date;
+      id: string;
+    }[]
+  >;
 
   // Example mocked method for 'fetching' list data
   const { loading: itemLoading, action: getItems } = useAsync(async (payload) => {
@@ -33,7 +40,7 @@ export default () => {
               id: "item-id-3",
             },
           ]),
-        1000
+        1000,
       );
     });
   });

package/dist/templates/variants/classic/src/modules/classic-module/locales/en.json

@@ -37,6 +37,9 @@
         "MOBILE": {
           "CREATED": "Created"
         }
+      },
+      "ALERTS": {
+        "CLOSE_CONFIRMATION": "You have unsaved changes\nClose anyway?"
       }
     }
   }

package/dist/templates/variants/classic/src/modules/classic-module/pages/details.vue

@@ -48,6 +48,7 @@ export interface Emits {
 
 defineOptions({
   url: "/classic-module-details",
+  name: "ClassicModuleDetails",
 });
 
 const props = withDefaults(defineProps<Props>(), {
@@ -68,7 +69,9 @@ const bladeToolbar = ref<IBladeToolbar[]>([
     title: computed(() => t("MODULE.PAGES.LIST.TOOLBAR.REFRESH")),
     icon: "fas fa-sync-alt",
     async clickHandler() {
-      await getItem({ id: props.param });
+      if (props.param) {
+        await getItem({ id: props.param });
+      }
     },
   },
 ]);

package/dist/templates/variants/classic/src/modules/classic-module/pages/list.vue

@@ -87,7 +87,7 @@ export interface Emits {
   (event: "parent:call", args: IParentCallArgs): void;
   (event: "collapse:blade"): void;
   (event: "expand:blade"): void;
-  (event: "open:blade", blade: IBladeEvent);
+  (event: "open:blade", blade: IBladeEvent): void;
   (event: "close:blade"): void;
 }
 
@@ -96,10 +96,10 @@ defineOptions({
   name: "ClassicModuleList",
   isWorkspace: true,
   menuItem: {
-    title: 'MODULE.MENU.TITLE',
+    title: "MODULE.MENU.TITLE",
     icon: "fas fa-file-alt",
     priority: 1,
-  }
+  },
 });
 
 const props = withDefaults(defineProps<Props>(), {
@@ -135,7 +135,7 @@ watch(
       });
     }
   },
-  { immediate: true }
+  { immediate: true },
 );
 
 onMounted(async () => {
@@ -247,7 +247,7 @@ const onHeaderClick = (item: ITableColumns) => {
   }
 };
 
-const actionBuilder = (item: { status: string }): IActionBuilderResult[] => {
+const actionBuilder = (item: (typeof data.value)[number]): IActionBuilderResult[] => {
   const result = [];
 
   result.push({
@@ -255,7 +255,9 @@ const actionBuilder = (item: { status: string }): IActionBuilderResult[] => {
     title: "Delete",
     variant: "danger",
     leftActions: true,
-    // clickHandler() {},
+    clickHandler() {
+      throw new Error("Function is not implemented.");
+    },
   });
 
   return result;

package/dist/templates/variants/dynamic/src/main.ts

@@ -30,7 +30,7 @@ async function startApp() {
   });
 
   app.config.errorHandler = (err) => {
-    notification.error(err.toString(), {
+    notification.error((err as Error).toString(), {
       timeout: 5000,
     });
   };

package/dist/templates/variants/dynamic/src/modules/dynamic-module/composables/useDetails/index.ts

@@ -1,14 +1,9 @@
 /* eslint-disable import/no-unresolved */
-import { Ref, computed, ref } from "vue";
+import { computed, ref, Ref } from "vue";
 import img1 from "/assets/1.jpeg";
 import img2 from "/assets/2.jpg";
 import img3 from "/assets/3.jpg";
-import {
-  DetailsBaseBladeScope,
-  DynamicBladeForm,
-  IBladeToolbar,
-  useDetailsFactory,
-} from "@vc-shell/framework";
+import { DetailsBaseBladeScope, DynamicBladeForm, IBladeToolbar, useDetailsFactory } from "@vc-shell/framework";
 
 export interface DynamicItemScope extends DetailsBaseBladeScope {
   toolbarOverrides: {
@@ -44,7 +39,7 @@ export default (args: {
               createdDate: new Date(),
               id: "item-id-3",
             },
-          ].find((x) => x.id === payload.id);
+          ].find((x) => x.id === payload?.id);
           resolve(findMockedItem);
         }, 1000);
       });
@@ -63,7 +58,9 @@ export default (args: {
     toolbarOverrides: {
       refresh: {
         async clickHandler() {
-          await load({ id: args.props.param });
+          if (args.props.param) {
+            await load({ id: args.props.param });
+          }
         },
       },
     },

package/dist/templates/variants/dynamic/src/modules/dynamic-module/composables/useList/index.ts

@@ -1,10 +1,17 @@
 /* eslint-disable import/no-unresolved */
-import { Ref, computed, ref } from "vue";
+import { computed, ref, Ref } from "vue";
 import img1 from "/assets/1.jpeg";
 import img2 from "/assets/2.jpg";
 import img3 from "/assets/3.jpg";
 import { DynamicBladeList, ListBaseBladeScope, useBladeNavigation, useListFactory } from "@vc-shell/framework";
 
+interface MockedItem {
+  imgSrc: string;
+  name: string;
+  createdDate: Date;
+  id: string;
+}
+
 // eslint-disable-next-line @typescript-eslint/no-empty-interface
 export interface DynamicItemsScope extends ListBaseBladeScope {}
 
@@ -15,7 +22,7 @@ export default (args: {
 }) => {
   const factory = useListFactory({
     load: async () => {
-      return await new Promise((resolve) => {
+      return await new Promise((resolve: (value: MockedItem[]) => void) => {
         setTimeout(
           () =>
             resolve([
@@ -38,9 +45,9 @@ export default (args: {
                 id: "item-id-3",
               },
             ]),
-          1000
+          1000,
         );
-      }).then((res: any[]) => {
+      }).then((res) => {
         return { results: res, totalCount: res.length };
       });
     },

package/dist/templates/variants/dynamic/src/modules/dynamic-module/locales/en.json

@@ -40,6 +40,9 @@
         "EMPTY": {
           "NO_ITEMS": "There are no items yet"
         }
+      },
+      "ALERTS": {
+        "CLOSE_CONFIRMATION": "You have unsaved changes\nClose anyway?"
       }
     }
   }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@vc-shell/create-vc-app",
   "description": "Application scaffolding",
-  "version": "1.0.130",
+  "version": "1.0.132",
   "type": "module",
   "bin": "./dist/index.js",
   "files": [
@@ -13,7 +13,7 @@
   },
   "devDependencies": {
     "@types/prompts": "^2.4.4",
-    "@vc-shell/ts-config": "^1.0.130",
+    "@vc-shell/ts-config": "^1.0.132",
     "copyfiles": "^2.4.1",
     "cross-env": "^7.0.3",
     "shx": "^0.3.4",