How to use admin-on-rest - 10 common examples

To help you get started, we’ve selected a few admin-on-rest examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github marmelab / aor-graphql / packages / admin-on-rest-graphql-demo / src / commands / index.js View on Github external
export const CommandList = props => (
    } sort={{ field: 'date', order: 'DESC' }} perPage={25}>
        
            
            
            
            
            
            
            
            
        
    
);

const CommandTitle = translate(({ record, translate }) =&gt; console.log({record}) || <span>{translate('resources.Command.name', { smart_count: 1 })} #{record.reference}</span>);

export const CommandEdit = translate(({ translate, ...rest }) =&gt; (
    } {...rest}&gt;
        
            
            
            
                 `${choice.firstName} ${choice.lastName}`} /&gt;
github marmelab / admin-on-rest-demo / src / visitors / SegmentsInput.js View on Github external
import React from 'react';
import { translate, SelectArrayInput } from 'admin-on-rest';

import segments from '../segments/data';

const SegmentsInput = ({ translate, ...rest }) =&gt; (
     ({ id: segment.id, name: translate(segment.name) }))} /&gt;
);

const TranslatedSegmentsInput = translate(SegmentsInput);

TranslatedSegmentsInput.defaultProps = {
    addField: true,
    source: 'groups',
};

export default TranslatedSegmentsInput;
github marmelab / admin-on-rest-demo / src / visitors / SegmentsField.js View on Github external
const styles = {
    main: { display: 'flex', flexWrap: 'wrap' },
    chip: { margin: 4 },
};

const SegmentsField = ({ record, translate }) =&gt; (
    <span style="{styles.main}">
        {record.groups.map(segment =&gt; (
            
                {translate(segments.find(s =&gt; s.id === segment).name)}
            
        ))}
    </span>
);

const TranslatedSegmentsField = translate(SegmentsField);

TranslatedSegmentsField.defaultProps = {
    addLabel: true,
    source: 'groups',
};

export default TranslatedSegmentsField;
github marmelab / react-admin / example / comments.js View on Github external
)
        );
    }
);

const cardStyle = {
    width: 300,
    minHeight: 300,
    margin: '0.5em',
    display: 'inline-block',
    verticalAlign: 'top',
};

const CommentGrid = translate(({ ids, data, basePath, translate }) =&gt; (
    <div style="{{">
        {ids.map(id =&gt; (
            
                }
                    subtitle={
                        
                    }
                    avatar={} /&gt;}
                /&gt;
                
                    
                
                
                    {translate('comment.list.about')}&nbsp;
                    </div>
github marmelab / react-admin / example / comments.js View on Github external
import { Card, CardActions, CardHeader, CardText } from 'material-ui/Card';
import FlatButton from 'material-ui/FlatButton';
import { Toolbar, ToolbarGroup } from 'material-ui/Toolbar';
import ChevronLeft from 'material-ui/svg-icons/navigation/chevron-left';
import ChevronRight from 'material-ui/svg-icons/navigation/chevron-right';
export CommentIcon from 'material-ui/svg-icons/communication/chat-bubble';

const CommentFilter = ({ ...props }) =&gt; (
    
);

const CommentPagination = translate(
    ({ page, perPage, total, setPage, translate }) =&gt; {
        const nbPages = Math.ceil(total / perPage) || 1;
        return (
            nbPages &gt; 1 &amp;&amp; (
                
                    
                        {page &gt; 1 &amp;&amp; (
                            }
                                onClick={() =&gt; setPage(page - 1)}
                            /&gt;
                        )}
                        {page !== nbPages &amp;&amp; (
github marmelab / admin-on-rest-demo / src / commands / index.js View on Github external
export const CommandList = (props) =&gt; (
    } sort={{ field: 'date', order: 'DESC' }} perPage={25}&gt;
        
            
            
            
            
            
            
            
            
        
    
);

const CommandTitle = translate(({ record, translate }) =&gt; <span>{translate('resources.commands.name', { smart_count: 1 })} #{record.reference}</span>);

export const CommandEdit = translate(({ translate, ...rest }) =&gt; (
    } {...rest}&gt;
        
            
            
            
                 `${choice.first_name} ${choice.last_name}`} /&gt;
            
            
            
            <div style="{{"></div>
github marmelab / admin-on-rest-demo / src / categories / index.js View on Github external
import ProductRefField from '../products/ProductRefField';
import LinkToRelatedProducts from './LinkToRelatedProducts';

export const CategoryIcon = Icon;

export const CategoryList = (props) =&gt; (
    
        
            
            
            
        
    
);

const CategoryTitle = translate(({ record, translate }) =&gt; <span>{translate('resources.categories.name', { smart_count: 1 })} "{record.name}"</span>);

export const CategoryEdit = (props) =&gt; (
    } {...props}&gt;
github marmelab / admin-on-rest-demo / src / visitors / index.js View on Github external
);

const VisitorDeleteTitle = translate(({ record, translate }) =&gt; <span>
    {translate('resources.customers.page.delete')}&nbsp;
    {record &amp;&amp; <img alt="" width="25" src="{`${record.avatar}?size=25x25`}">}
    {record &amp;&amp; `${record.first_name} ${record.last_name}`}
</span>);

export const VisitorDelete = (props) =&gt; } /&gt;;
github marmelab / aor-graphql / packages / admin-on-rest-graphql-demo / src / segments / SegmentReferenceField.js View on Github external
import React from 'react';
import { translate, ReferenceArrayField, SingleFieldList } from 'admin-on-rest';

import Chip from 'material-ui/Chip';

const NameField = translate(({ translate: t, source, record = {} }) =&gt; (
    {t(`resources.Segment.data.${record[source]}`)}
));

const SegmentReferenceField = props =&gt; (
    
        
            
        
    
);

SegmentReferenceField.defaultProps = {
    label: 'resources.Customer.fields.groups',
    source: 'groupsIds',
    addLabel: true,
};
github marmelab / admin-on-rest-demo / src / products / index.js View on Github external
TabbedForm,
    TextField,
    TextInput,
} from 'admin-on-rest';
import Icon from 'material-ui/svg-icons/image/collections';
import Chip from 'material-ui/Chip';
import RichTextInput from 'aor-rich-text-input';

import CustomerReferenceField from '../visitors/CustomerReferenceField';
import StarRatingField from '../reviews/StarRatingField';
import GridList from './GridList';
import Poster from './Poster';

export const ProductIcon = Icon;

const QuickFilter = translate(({ label, translate }) =&gt; {translate(label)});

export const ProductFilter = props =&gt; (
    
);

export const ProductList = props =&gt; (

admin-on-rest

A frontend Framework for building admin applications on top of REST services, using ES6, React and Material UI

MIT
Latest version published 6 years ago

Package Health Score

51 / 100
Full package analysis

Popular admin-on-rest functions

Similar packages