0

I need to customize the list title, but to allow it in diff. languages. I try:

<List title='Hi there' ...>

and title is changed as expected BUT how do I make the string configurable from a file?

<List title={translate('myroot.list.header') ...>

doesn't work...

Filburt
  • 17,626
  • 12
  • 64
  • 115
bach
  • 369
  • 3
  • 10

2 Answers2

0

Try with a custom title component:

import { translate } from 'admin-on-rest';
const ListTitle = translate(({ translate }) => <span>{translate('my.title')}</span>);

<List title={<ListTitle />} >
François Zaninotto
  • 7,068
  • 2
  • 35
  • 56
  • thx. it doesn't work as it shows the 'my.title' as text. btw - syntax is wrong so i added ')' at the end: const ListTitle = translate(({ translate }) => {translate('my.title')}); and i don't understand why to use so many 'translate' functions in the statement :-) i don't understand the syntax... – bach Apr 06 '17 at 23:20
  • I have a file like a dic: export default { resources: { posts: { name: 'bla', }, }, }, my: { title: 'tt', }, }; which is passed to in messages and it works for the Resource Names but not to your suggestion – bach Apr 06 '17 at 23:31
  • Does something print in the console? – François Zaninotto Apr 10 '17 at 06:37
0

hope that it will help you:

customMessages.js

export const customMessages = {
    titles: {
        one: 'First Title',
        two: 'Second Title',
    },
}

App.js

import { englishMessages } from 'admin-on-rest';
import { customMessages } from './customMessages';
const messages = {
    'en': {...englishMessages, ...customMessages},
};

resources.js

export const ResourceList = (props) => (
  <List {...props} title="titles.one">
    <Datagrid>
      <TextField source="id" />
      <TextField source="text" />
      <EditButton />
      <DeleteButton />
    </Datagrid>
  </List>
);

Replace next to your names:

resources.js
ResourceList
Alexey
  • 601
  • 7
  • 17