1717/**
1818 * External dependencies
1919 */
20+ import classNames from 'classnames' ;
2021import _uniqueId from 'lodash/uniqueId' ;
2122
2223/**
@@ -35,7 +36,15 @@ import Switch from './switch';
3536import Button from '../../../wizard/components/navigation/button' ;
3637import { update , toggleAutoUpdate } from '../../utils' ;
3738
38- const Updater = ( { title, lastUpdated, needsKey, checked, type } ) => {
39+ const Updater = ( {
40+ title,
41+ lastUpdated,
42+ needsKey,
43+ checked,
44+ type,
45+ displayUpdatedOn,
46+ versionAvailable,
47+ } ) => {
3948 const [ id ] = useState ( _uniqueId ( 'updater-' ) ) ;
4049 const { state, dispatch } = useContext ( SettingsContext ) ;
4150 const isDisabled = needsKey && 'ok' !== state . apiStatus ;
@@ -76,11 +85,15 @@ const Updater = ( { title, lastUpdated, needsKey, checked, type } ) => {
7685
7786 const handleAutoUpdateToggle = ( ) => {
7887 dispatch ( { type : ACTIONS . TOGGLE_UPDATES , payload : { type } } ) ;
79- toggleAutoUpdate ( type ) ;
88+ toggleAutoUpdate ( type , checked ) ;
8089 } ;
8190
8291 return (
83- < div className = "material-settings__updater" >
92+ < div
93+ className = { classNames ( 'material-settings__updater' , {
94+ 'no__last-update' : false === displayUpdatedOn && ! versionAvailable ,
95+ } ) }
96+ >
8497 < div className = "mdc-layout-grid" >
8598 < div className = "mdc-layout-grid__inner" >
8699 < div className = "mdc-layout-grid__cell mdc-layout-grid__cell--span-7 mdc-layout-grid__cell--align-middle" >
@@ -104,14 +117,23 @@ const Updater = ( { title, lastUpdated, needsKey, checked, type } ) => {
104117 > </ p >
105118 ) }
106119
107- { ! isDisabled && (
120+ { ! isDisabled && false !== displayUpdatedOn && (
108121 < p className = "mdc-typography--body1" >
109122 { sprintf (
110123 __ ( 'Last update on %s' , 'material-design' ) ,
111124 updatedDate
112125 ) }
113126 </ p >
114127 ) }
128+
129+ { versionAvailable && (
130+ < p className = "mdc-typography--body1" >
131+ { sprintf (
132+ __ ( 'New version %s is available.' , 'material-design' ) ,
133+ versionAvailable
134+ ) }
135+ </ p >
136+ ) }
115137 </ div >
116138
117139 < div className = "mdc-layout-grid__cell mdc-layout-grid__cell--span-3 mdc-layout-grid__cell--align-middle material-settings__cell--justify-end" >
0 commit comments