Giter Club home page Giter Club logo

dev-family / admiral Goto Github PK

View Code? Open in Web Editor NEW
164.0 164.0 21.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.

License: MIT License

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 react react-admin react-admin-dashboard react-admin-template reactjs

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  avatar

admiral's Issues

use only one action in table ( delete or update )

if disable actions (delete and update)
we cat specify "null" to "tableActions" field

export const CRUD = createCRUD({
path: '/users',
resource: 'users',
index: {
title: 'Users',
newButtonText: 'Add',
tableColumns: [...],
tableActions: null,
},
...

how can I make only one of this? delete or update, or custom acion?

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.

custom pages without auth

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

how can I remove "+ add" button from index page in default index page?

how can I remove "+ add" button from index page in default index page?

in this code, I found how change text of button for create record, but how can I remove this button?

export const CRUD = createCRUD({
    path: '/users',
    resource: 'users',
    index: {
        title: 'Пользователи',
        newButtonText: 'Add',
        ...

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!

how can I set notification message(usually exist in response in body), when I send custom request from custom form

Hello!)
I want to send messages from users page to selectable users.

  • select users
tableConfig: {
            rowSelection: {
                render: ({ selectedRowKeys }) => <RowSelection selectedKeys={selectedRowKeys} />,
            },
 },
  • click on additional action - send message
  • in modal window in custom form write message
  • submit

Сouldn't understand how make with your tools...

after submiting I get response with "message" field in body in response
how can I invoke getted text-message in notification like in image below ?

image

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?

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.

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?

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.