VocabularyCard.tsx 1.13 KB
Newer Older
1 2 3 4 5 6
import * as React from 'react';
import { translate } from 'react-i18next';
import { Link } from 'react-router-dom';
import Card, { CardHeader, CardContent, CardActions } from 'ui/common/Card';

import Vocabulary from 'model/vocabulary/Vocabulary';
Matija Obreza's avatar
Matija Obreza committed
7
import Markdown from 'ui/common/markdown';
8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27
import Button from '@material-ui/core/Button';

const VocabularyCard = ({ vocabulary, className = '', textRows = 2, t }: { vocabulary: Vocabulary, className?: string, textRows?: number, t: any }) => vocabulary && (
  <Card className={ className }>
    <CardHeader title={ <Link to={ `/vocabulary/${vocabulary.uuid}` }>{ vocabulary.title }</Link> }/>
    { vocabulary.description &&
    <CardContent>
      <Markdown firstParagraph source={ vocabulary.description }/>
    </CardContent>
    }
    <CardActions>
      <Link to={ `/vocabulary/${vocabulary.uuid}` }><Button>{ t('common:action.viewDetails') }</Button></Link>
      { vocabulary._permissions.write &&
      <Link to={ `/admin/vocabulary/${vocabulary.uuid}/edit` }><Button>{ t('common:action.edit') }</Button></Link>
      }
    </CardActions>
  </Card>
);

export default translate()(VocabularyCard);