AdminBro - Failed to upload image

Question

admin-bro and sequelize failed to upload image. It still works on Edit but not on New. It doesn't show the error at any other line in the code.

Installed libraries and their versions "admin-bro": "^2.2.4", "admin-bro-expressjs": "^2.0.2", "admin-bro-mongoose": "^0.5.0", "admin-bro-sequelize": "^1.1.1",

AdminBroOptions with schema

const options = {
  properties: {
    images: {
      components: {
        edit: AdminBro.bundle('./components/upload-image.edit.tsx'),
        list: AdminBro.bundle('./components/upload-image.list.tsx'),
        show: AdminBro.bundle('./components/upload-image.show.tsx')
      },
    },
  },
  actions: {
    new: {
       after: async (response, request, context) => {
         return uploadAfterHook(response, request, context);
       },
       before: async (response, request, context) => {
        return uploadBeforeHook(request, context);
       }
    },
    edit: {
      after: async (response, request, context) => {
        return uploadAfterHook(response, request, context);
      },
      before: async (request, context) => {
        return uploadBeforeHook(request, context);
      },
    },
  },
};

Here are my hooks (before and after).

const path = require('path');
const fs = require('fs');
const AdminBro = require('admin-bro');


/** @type {AdminBro.After<AdminBro.ActionResponse>} */
const after = async (response, request, context) => {

  console.log('on after hook of opal');
  const { record, uploadImage } = context;

  if (record.isValid() && uploadImage) {
    const filePath = path.join('uploads', 'opals', record.id().toString(), uploadImage.name);
    await fs.promises.mkdir(path.dirname(filePath), { recursive: true });

    await fs.promises.rename(uploadImage.path, filePath);

    await record.update({ images: `/${filePath}` });

    response.record.params.image = filePath;
  }
  return response;
};

/** @type {AdminBro.Before} */
const before = async (request, context) => {
  console.log('on before hook of opal');

  if (request.method === 'post') {
    const { images, ...otherParams } = request.payload;

    // eslint-disable-next-line no-param-reassign
    context.uploadImage = images;
    return {
      ...request,
      payload: otherParams,
    };
  }
  return request;
};

module.exports = { after, before };

I am using mysql database using admin-bro-sequelize adapter and below is my model (entity).

const { Sequelize, DataTypes } = require('sequelize');

const sequelize = new Sequelize(
    'test_db',
    'byal',
    'byal-f',
     {
       host: 'localhost',
       dialect: 'mysql'
     }
);

   
sequelize.authenticate().then(() => {
    console.log('Connection has been established successfully.');
}).catch((error) => {
    console.error('Unable to connect to the database: ', error);
});


const Opals = sequelize.define("opals", {   
    name: {
      type: DataTypes.TEXT('medium'),
      allowNull: false
    },
    type: {
        type: DataTypes.TEXT('medium'),
        allowNull: true
    },
    images: {
        type: DataTypes.TEXT('long'),
        allowNull: true,
    },
    color: {
      type: DataTypes.TEXT('medium'),
      allowNull: true
    },
    grading: {
      type: DataTypes.TEXT('medium'),
      allowNull: true
    },
    region: {
      type: DataTypes.TEXT('medium'),
      allowNull: true
    },
    weight: {
      type: DataTypes.TEXT('medium'),
      allowNull: true
    },
    description: {
        type: DataTypes.TEXT('long'),
        allowNull: false,
    },
    isAvailable: {
        type: DataTypes.BOOLEAN,
        defaultValue: true,
        allowNull: true
    },
    inactive: {
        type: DataTypes.BOOLEAN,
        defaultValue: false,
        allowNull: true
    },
    views: {
      type: DataTypes.INTEGER,
      defaultValue: 1,
      allowNull: true
    }
 });
 
sequelize.sync().then(() => {
    console.log('Opals table created successfully!');
}).catch((error) => {
    console.error('Unable to create opals table : ', error);
});

module.exports = Opals;

How can I fix this? What do I miss?

Answer 1

I had the same problem, the difference is that I am storing the images into the DB as base64. However my problem was with the rec id. You can check my working code here: if (record && record.isValid() && uploadImage) { await record.update({ image: uploadImage }); } return response; https://pastebin.com/1uMRFpM9