What's the best way to use Payload local API in a custom component?

default discord avatar
kalon_robson12 months ago
4

Context: I'm producing a plugin that will add a view to the config.admin.components and it's within this component I want to use the local API.



export default (pluginConfig: PluginConfig): Plugin =>
  config => {
    const updatedConfig: Config = {
      ...config,
      admin: {
        ...config.admin,
        components: {
          ...config.admin?.components,
          views: {
            ...config.admin?.components?.views,
            MigrateExportView: {
              Component: ({ user, canAccessAdmin }) =>
                React.createElement(MigrateView, { user, canAccessAdmin, migrateType: 'export' }),
              path: '/migrate/export',
            },
            MigrateImportView: {
              Component: ({ user, canAccessAdmin }) =>
                React.createElement(MigrateView, { user, canAccessAdmin, migrateType: 'import' }),
              path: '/migrate/import',
            },
          },
        },
      },
    }

    return deepmerge(updatedConfig, pluginConfig.overwrites || {})
  }
  • discord user avatar
    jarrod_not_jared
    12 months ago

    @Kalon-Robson you won’t be able to use the local api in a react component if that’s what you mean? Instead you’ll want to use the rest or GraphQL api

  • default discord avatar
    aaronksaunders12 months ago
  • default discord avatar
    kalon_robson12 months ago

    10pm at night. I should've went to bed. Why I was expecting to interact with the server code from the client side is now beyond me.



    Now we need to push to have :this: Typed which would be super cool

  • default discord avatar
    aaronksaunders12 months ago

    glad to help out, i think alot of us are trying to wrap our arms around this and learning and hopefully sharing along the way

Star on GitHub

Star

Chat on Discord

Discord

online

Can't find what you're looking for?

Get help straight from the Payload team with an Enterprise License.