update(last review): modifications based on last review

.eslintrc

@@ -1,15 +1,11 @@
 {
-  "extends": [
-    "codex",
-    "plugin:@typescript-eslint/recommended"
-  ],
   "globals": {
-    "fetch": true,
-    "ImageConfig": true,
-    "ImageToolData": true
+    "HTMLOListElement": true,
+    "HTMLUListElement": true
   },
-  "parser": "@typescript-eslint/parser",
-  "plugins": [
-    "@typescript-eslint"
-  ]
-}
+  "parserOptions": {
+    "sourceType": "module",
+    "ecmaVersion": 2020
+  },
+  "parser": "@typescript-eslint/parser"
+}

.github/workflows/npm-publish.yml

@@ -6,6 +6,19 @@ on:
       - master
 
 jobs:
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v2
+      - uses: actions/setup-node@v1
+        with:
+          node-version: 19
+          registry-url: https://registry.npmjs.org/
+      - run: yarn install
+      - run: yarn build
+        env:
+          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
+
   publish-and-notify:
     uses: codex-team/github-workflows/.github/workflows/npm-publish-and-notify-reusable.yml@main
     secrets:

package.json

@@ -26,19 +26,19 @@
     "dev": "vite",
     "build": "vite build",
     "lint": "eslint src/ --ext .ts",
-    "lint:errors": "eslint src/ --ext .ts --quiet",
-    "lint:fix": "eslint src/ --ext .ts --fix"
+    "lint:errors": "eslint src/ --quiet",
+    "lint:fix": "eslint src/ --fix"
   },
   "author": {
     "name": "CodeX",
     "email": "[email protected]"
   },
   "devDependencies": {
     "@codexteam/ajax": "^4.2.0",
-    "@editorjs/editorjs": "^2.29.1",
+    "@editorjs/editorjs": "2.30.0-rc.12",
     "@typescript-eslint/eslint-plugin": "^7.13.1",
     "@typescript-eslint/parser": "^7.13.1",
-    "eslint": "^9.5.0",
+    "eslint": "^7.22.0",
     "eslint-config-codex": "^2.0.1",
     "eslint-loader": "^4.0.2",
     "formidable": "^3.5.1",

src/index.ts

@@ -90,21 +90,21 @@ export default class ImageTool implements BlockTool {
   constructor({ data, config, api, readOnly, block }: ImageToolConstructorOptions) {
     this.api = api;
     this.readOnly = readOnly;
-    this.block = block ? block : {} as BlockAPI;
+    this.block = block;
 
     /**
      * Tool's initial config
      */
     this.config = {
-      endpoints: config ? config.endpoints : {},
-      additionalRequestData: config ? config.additionalRequestData: {},
-      additionalRequestHeaders: config ? config.additionalRequestHeaders: {},
-      field: config ? config.field: 'image',
-      types: config ? config.types: 'image/*',
-      captionPlaceholder: this.api.i18n.t(config && config.captionPlaceholder ? config.captionPlaceholder: 'Caption'),
-      buttonContent: config ? config.buttonContent : '',
-      uploader: config ? config.uploader : undefined,
-      actions: config ? config.actions: [],
+      endpoints: config.endpoints,
+      additionalRequestData: config.additionalRequestData,
+      additionalRequestHeaders: config.additionalRequestHeaders,
+      field: config.field,
+      types: config.types,
+      captionPlaceholder: this.api.i18n.t(config.captionPlaceholder ? config.captionPlaceholder: 'Caption'),
+      buttonContent: config.buttonContent,
+      uploader: config.uploader,
+      actions: config.actions,
     };
 
     /**

src/types/codexteam__ajax.d.ts

@@ -1,9 +1,9 @@
 declare module '@codexteam/ajax' {
     export interface AjaxOptions {
-      url: string;
+      url?: string;
       data?: any;
       accept?: string;
-      headers?: Record<string, string>;
+      headers?: Headers;
       beforeSend?: (files: File[]) => void;
       fieldName?: string;
       type?: string;

src/types/types.ts

@@ -25,9 +25,9 @@ export interface ActionConfig {
   title: string;
 
   /**
-   * A flag indicating whether the tune is a toggle (true) or not (false).
+   * An optional flag indicating whether the tune is a toggle (true) or not (false).
    */
-  toggle: boolean;
+  toggle?: boolean;
 
   /**
    * An optional action function to be executed when the tune is activated.
@@ -58,9 +58,9 @@ export interface UploadResponseFormat {
 }
 
 /**
- * ImageToolData interface representing the input and output data format for the image tool.
+ * ImageToolData type representing the input and output data format for the image tool, including optional custome actions.
  */
-export interface ImageToolData {
+export type ImageToolData<Actions = {}> = {
   /**
    * Caption for the image.
    */
@@ -87,12 +87,7 @@ export interface ImageToolData {
   file: {
     url: string;
   };
-
-  /**
-   * Additional actions for the tool.
-   */
-  actions?: ActionConfig[];
-}
+} & (Actions extends Record<string, boolean> ? Actions : {});
 
 /**
  *

src/ui.ts

@@ -10,17 +10,17 @@ enum UiState {
   /**
    * The UI is in an empty state, with no image loaded or being uploaded.
    */
-  Empty = "EMPTY",
+  Empty = "empty",
 
   /**
    * The UI is in an uploading state, indicating an image is currently being uploaded.
    */
-  Uploading = "UPLOADING", 
+  Uploading = "uploading", 
 
   /**
    * The UI is in a filled state, with an image successfully loaded.
    */
-  Filled = "FILLED"
+  Filled = "filled"
 };
 
 /**

src/uploader.ts

@@ -85,20 +85,17 @@ export default class Uploader {
       });
 
     // default uploading
-    } else if (this.config.endpoints.byFile) {
+    } else {
       upload = ajax.transport({
         url: this.config.endpoints.byFile,
         data: this.config.additionalRequestData,
         accept: this.config.types,
-        headers: this.config.additionalRequestHeaders as Record<string, string>,
+        headers: new Headers(this.config.additionalRequestHeaders as Record<string, string>),
         beforeSend: (files: File[]) => {
           preparePreview(files[0]);
         },
         fieldName: this.config.field,
       }).then((response: any) => response.body);
-    } else {
-      this.onError('No valid upload configuration provided.');
-      return ;
     }
 
     upload.then((response) => {
@@ -131,12 +128,12 @@ export default class Uploader {
        * Default uploading
        */
       upload = ajax.post({
-        url: this.config.endpoints.byUrl!,
+        url: this.config.endpoints.byUrl,
         data: Object.assign({
           url: url,
         }, this.config.additionalRequestData),
         type: ajax.contentType.JSON,
-        headers: this.config.additionalRequestHeaders as Record<string, string>,
+        headers: new Headers(this.config.additionalRequestHeaders as Record<string, string>),
       }).then((response: any) => response.body);
     }
 
@@ -178,7 +175,7 @@ export default class Uploader {
       if (!isPromise(upload)) {
         console.warn('Custom uploader method uploadByFile should return a Promise');
       }
-    } else if (this.config.endpoints.byFile) {
+    } else {
       /**
        * Default uploading
        */
@@ -196,11 +193,8 @@ export default class Uploader {
         url: this.config.endpoints.byFile,
         data: formData,
         type: ajax.contentType.JSON,
-        headers: this.config.additionalRequestHeaders as Record<string, string>,
+        headers: new Headers(this.config.additionalRequestHeaders as Record<string, string>),
       }).then((response: any) => response.body);
-    } else {
-      this.onError('No valid upload configuration provided.');
-      return ;
     }
 
     upload.then((response) => {