1

Feature request

  1. provide download feature where if i a filter is applied the triggered download should download filtered data in an excel sheet.

Their is an api when given tableName and filter columns it fetches that data returns. But the issue with including that api in the action handler is, this handler runs in server environment which doesn't have access to window object to download the excel even if i have the data.

But why window is required??

  // for THIS.
  const newRes = await res.blob();
  const url = window.URL.createObjectURL(new Blob([newRes]));
  const link = document.createElement("a");
  link.href = url;
  link.setAttribute("download", `users.xlsx`);
  link.click();

package.json

  "@adminjs/express": "5.0.1",
   "@adminjs/prisma": "3.0.1",
   "@prisma/client": "4.8.1",
   "@tiptap/core": "^2.0.0",
   "@tiptap/pm": "^2.0.3",
   "adminjs": "6.7.4",

Handler with download functionality

handler(request, response, context) {
          console.log(filterQuery);
          fetch(`someApi/users`, {
            method: "GET",
            "Content-Type": "application/vnd.openxmlformats"
          })
            .then(async (res) => {
              const newRes = await res.blob();
              const url = window.URL.createObjectURL(new Blob([newRes]));
              const link = document.createElement("a");
              link.href = url;
              link.setAttribute("download", `users.xlsx`);
              link.click();
            })
            .catch((err) => {
              console.log("ERR", err);
            })
            .finally(() => {
            });
          filterQuery = {};
          return true;
        },

Custom Download Action

 actions: {
      list: {
        // due to this hook i have the filter queries
        before: [saveFilterQueriesAFTER]
      },
      //custom action
      Download: {
        actionType: "resource", 
        icon: "Download",
        component: Adminjs.bundle("../../Components/Download.jsx")
      }
    }

Function which gets the query params

This func is required because when the custom action is triggered it changes the URL by which i loose the filtered query params

function saveFilterQueriesAFTER(originalResponse) {
  let filters = Object.keys(originalResponse.query);
  if (filters.length > 0) {
    filters.map((filter) => {
      if (filter !== "page") {
        Object.assign(filterQuery, {
          [filter.slice(8)]: originalResponse.query?.[filter]
        });
       // { full_name: 'SHAHED' }
      }
    });
  }
  return originalResponse;
}

Now the filter queries i have accumulated in (filterQuery) i want to send it to this custom component so that i can access it and get data from the db using this filter queries, so is there any way i can send this props to the Download component.

Another Way

  • when adminjs itself is getting filtered data, i want to access that data directly and save it a variable instead of saving its filter queries which will any way get the same data from db.
    • if this possible
    • how to access that data?
    • how to send that data as props to my custom component Download.jsx
Mohammed Shahed
  • 840
  • 2
  • 15

0 Answers0