Coder Social home page Coder Social logo

dev-family / admiral Goto Github PK

View Code? Open in Web Editor NEW
125.0 4.0 16.0 18.71 MB

Admiral is a frontend framework for creating back office in React. It provides out-of-the-box components and tools that make developing an admin interface easy and fast.

TypeScript 13.44% SCSS 3.47% HTML 0.01% CSS 1.01% JavaScript 82.07% Shell 0.01%
admin admin-dashboard admin-dashboard-component admin-dashboard-ui admin-on-rest admin-panel admin-template admin-ui dashboard developer-tools

admiral's People

Contributors

alonsomusic avatar amurashkowebsecret avatar arturvolokhin avatar elianta avatar mr-bantsevich avatar n7olkachev avatar slavik1999 avatar tairau avatar yanakorpan avatar zavilenskyilya avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar

admiral's Issues

how can I customize components?

On your demo, this component looks like this:
Снимок экрана 2024-01-08 в 20 50 12
And on my panel after installation it looks like this:
Снимок экрана 2024-01-08 в 20 54 32
How can I customize this and other components?

custom pages without auth

Я могу создать страницу на подобии визитки, которая будет доступна всем? То есть отключить авторизацию на определенных маршрутах или наоборот сделать саму админ панель только на руте /admin и включить авторизацию только туда?

Support non-`id` primary keys

It looks like Admiral is hard-coded to expect an id attribute to be the primary key for data.


pathname={`${config.path}/${record.id}`}

id={record.id}

This is an issue if using an API with a different name for the primary key! (For example, I'm trying to work with objects that have sessionID as their primary key.)

It would be useful to be able to specify this as part of a CRUD definition.

component customize

Hi. Could you please advise me on how to customize components that are not passed as an attribute to the Admin component? I figured out how to do it with menuPopupExtraComponents, but what if I need to reconfigure the entire footer (sidebar bottom), or the entire sidebar, or all page layout? I couldn't figure it out.

I see that the question of customization has been asked more than once, and it would be great to have a more detailed explanation.

Thanks in advance!

Using multiple API sources

Just wondered if there was an idiomatic way to configure one Admiral frontend instance to talk to multiple backend APIs?

In my case, I have a bunch of different microservices all sharing an authentication method (JWT).

The best way I've found is to do something like the following:

const multiDataProvider = (resourceMap: { [key: string]: DataProvider }) : DataProvider => {
  return {

    getList: (resource: string, params: object) => resourceMap[resource].getList(resource, params),

    getOne: (resource: string, params: GetOneParams) => resourceMap[resource].getOne(resource, params),

    getCreateFormData: (resource: string) => resourceMap[resource].getCreateFormData(resource),

    getFiltersFormData: (resource: string) => resourceMap[resource].getFiltersFormData(resource),

    create: (resource: string, params: CreateParams) => resourceMap[resource].create(resource, params),

    getUpdateFormData: (resource: string, params: GetOneParams) => resourceMap[resource].getUpdateFormData(resource, params),

    update: (resource: string, params: UpdateParams) => resourceMap[resource].update(resource, params),

    deleteOne: (resource: string, params: DeleteParams) => resourceMap[resource].deleteOne(resource, params),

    reorderList: (resource: string, params: ReorderParams) => resourceMap[resource].reorderList(resource, params)
  }
}

const usersDataProvider = dataProvider(usersUrl);
const replaysDataProvider = dataProvider(replaysUrl);

const mdp = multiDataProvider({
    'users': usersDataProvider,
    'replays': replaysDataProvider,
    'errors': replaysDataProvider
})

then supplying mdp to <Admin> as its dataProvider prop.

Is there a better/easier/more Admiral-ish way?

Use custom form and rules

Hello.
How I can use form with custom rules?
Can I use other UI kit with yours dataProvider?
Thank you for for your time.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.