https://github.com/bertrandmartel/cloud-admin
Database admin interface with dynamic model configuration supporting table relations through datatable views powered by React
https://github.com/bertrandmartel/cloud-admin
admin-dashboard database datatables material-ui react react-table
Last synced: 11 months ago
JSON representation
Database admin interface with dynamic model configuration supporting table relations through datatable views powered by React
- Host: GitHub
- URL: https://github.com/bertrandmartel/cloud-admin
- Owner: bertrandmartel
- License: mit
- Created: 2018-03-05T02:53:33.000Z (almost 8 years ago)
- Default Branch: master
- Last Pushed: 2018-09-03T16:54:51.000Z (over 7 years ago)
- Last Synced: 2025-01-03T20:12:25.643Z (about 1 year ago)
- Topics: admin-dashboard, database, datatables, material-ui, react, react-table
- Language: JavaScript
- Homepage:
- Size: 1.76 MB
- Stars: 2
- Watchers: 3
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE.md
Awesome Lists containing this project
README
# Cloud Admin
[](https://travis-ci.org/bertrandmartel/cloud-admin)
[](LICENSE.md)
A database admin interface with dynamic model configuration supporting table relations through datatable views powered by React
### [Live Application](http://bertrandmartel.github.io/cloud-admin)
[](http://bertrandmartel.github.io/cloud-admin)
### Configuration
#### Edit mode
To match your own model, edit configuration file [config.js](./src/config.js) :
```javascript
export default
{
showEditMode: true,
mode: [{
name: "demo"
}, {
name: "server",
url: "http://localhost:4000/admin/headers"
}]
}
```
This JSON configuration has the following format :
* showEditMode [boolean] - whether to show the dropdown box with the list of mode **Required**
* mode [Array] - list of modes **Required**
The list of mode can include :
* name [String] - the mode name **Required**
* url [String] - url to fetch the model configuration file **Required except for demo mode**
#### Model endpoint
The model endpoint specified in the `url` field in the mode configuration file should return a JSON array with the following format :
```json
[{
"name": "users",
"displayName": "Users",
"fields": [{
"accessor": "userId"
}, {
"accessor": "email"
}, {
"accessor": "createdAt",
"filterable": false
}, {
"accessor": "updatedAt",
"filterable": false
}]
}]
```
Properties :
* name [String] - table name **Required**
* displayName [String] - name to display on tab
* fields [Array] - list of accessor & other table properties **Required**
* accessor [String] - accessor name **Required**
* aggregate [Boolean] - specify if this field should be visible on the same line as the pivoted field (works only for the 1st pivoted field)
* pivotBy [Array] - array of string with accessor name for pivoted field
* subFields [Array] - list of accessor & other table properties for sub tables only if pivotBy was specified
All properties of `fields` & `subFields` array are expanded into [react-table columns](https://github.com/react-tools/react-table#columns) (except for `aggregate` which is processed differently)
A Sample JSON configuration is available under [src/demo/template.js](./src/demo/template.js)
### Dependencies
This project is using :
* [React](https://github.com/facebook/react)
* [Material UI](https://github.com/callemall/material-ui)
* [React Table](https://react-table.js.org)
* [Axios](https://github.com/axios/axios)
* [Moment.js](http://momentjs.com/)
* [uuid](https://github.com/kelektiv/node-uuid)
This project has been created using [create-react-app](https://github.com/facebookincubator/create-react-app)
### Docker
Modify `homepage` field from `package.json` to match the target host :
* build
```
docker build . -t cloud-admin
```
* run
```
docker run -p 5000:5000 cloud-admin
```
## License
The MIT License (MIT) Copyright (c) 2018 Bertrand Martel