diff --git a/app/javascript/overview/BillboardTitle.jsx b/app/javascript/overview/BillboardTitle.jsx index 14f1df973..bda820f1b 100644 --- a/app/javascript/overview/BillboardTitle.jsx +++ b/app/javascript/overview/BillboardTitle.jsx @@ -6,6 +6,7 @@ import React from 'react' import styled, { css } from 'styled-components' import { connect } from 'react-redux' +import { injectIntl } from 'react-intl' import ActiveStorageProvider from 'react-activestorage-provider' import { EditableText } from '@blueprintjs/core' @@ -16,6 +17,7 @@ import LibraryLogo from './LibraryLogo' import AuthorsList from './AuthorsList' import { PositionedFileUploadWidget } from 'utility/FileUploadWidget' +import type { IntlShape } from 'react-intl' import type { State, CaseDataState, Byline, Library } from 'redux/state' function mapStateToProps ({ edit, caseData }: State) { @@ -48,36 +50,38 @@ function mapStateToProps ({ edit, caseData }: State) { } type Props = { - slug: string, + coverUrl: string, editing: boolean, + intl: IntlShape, kicker: string, - title: string, - photoCredit: string, - coverUrl: string, - updateCase: typeof updateCase, - minimal?: boolean, library: Library, links: $PropertyType, + minimal?: boolean, onBeginEditing?: () => void, onFinishEditing?: () => void, + photoCredit: string, + slug: string, + title: string, + updateCase: typeof updateCase, } & Byline export const UnconnectedBillboardTitle = ({ - slug, - editing, - kicker, - title, - photoCredit, - authors, - translators, acknowledgements, + authors, coverUrl, - updateCase, - minimal, + editing, + intl, + kicker, library, links, + minimal, onBeginEditing, onFinishEditing, + photoCredit, + slug, + title, + translators, + updateCase, }: Props) => { return ( @@ -108,7 +112,7 @@ export const UnconnectedBillboardTitle = ({ className="pt-multiline" value={kicker} disabled={!editing || minimal} - placeholder="Snappy kicker" + placeholder={intl.formatMessage({ id: 'cases.new.shortTitle' })} onChange={value => updateCase({ kicker: value })} onEdit={onBeginEditing} onCancel={onFinishEditing} @@ -119,7 +123,7 @@ export const UnconnectedBillboardTitle = ({ multiline value={title} disabled={!editing || minimal} - placeholder="What is the central question of the case?" + placeholder={intl.formatMessage({ id: 'cases.new.whatQuestion' })} onChange={value => updateCase({ title: value })} onEdit={onBeginEditing} onCancel={onFinishEditing} @@ -147,7 +151,13 @@ export const UnconnectedBillboardTitle = ({ multiline value={photoCredit} disabled={!editing} - placeholder={editing ? 'Photo credit' : ''} + placeholder={ + editing + ? intl.formatMessage({ + id: 'activerecord.attributes.case.photoCredit', + }) + : '' + } onChange={value => updateCase({ photoCredit: value })} onEdit={onBeginEditing} onCancel={onFinishEditing} @@ -166,9 +176,10 @@ export const UnconnectedBillboardTitle = ({ ) } -export default connect(mapStateToProps, { updateCase })( - UnconnectedBillboardTitle -) +export default connect( + mapStateToProps, + { updateCase } +)(injectIntl(UnconnectedBillboardTitle)) export const CoverImageContainer = styled.div.attrs({ className: 'BillboardTitle pt-dark', diff --git a/config/locales/en.yml b/config/locales/en.yml index 8269e1b07..d8d077cb0 100644 --- a/config/locales/en.yml +++ b/config/locales/en.yml @@ -13,6 +13,7 @@ en: library_id: Library locale: Language location: Case location + photo_credit: Photo credit published: Published slug: Case URL teaching_guide: Teaching guide @@ -184,6 +185,8 @@ en: locations: Site locations new: create_a_case: Create a Case + short_title: Short Title + what_question: What is the central question of the case? settings: edit: case_editors: Case editors