Skip to content

Commit b18b26d

Browse files
committed
Merge pull request #33 from material-components/feature/8-auto-updates
Add plugin and theme auto update options to settings page
2 parents b26ab51 + e96f442 commit b18b26d

File tree

15 files changed

+272
-97
lines changed

15 files changed

+272
-97
lines changed

plugin/assets/css/src/settings/api.css

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,19 @@
1+
/**
2+
* Copyright 2021 Google LLC
3+
*
4+
* Licensed under the Apache License, Version 2.0 (the "License");
5+
* you may not use this file except in compliance with the License.
6+
* You may obtain a copy of the License at
7+
*
8+
* http://www.apache.org/licenses/LICENSE-2.0
9+
*
10+
* Unless required by applicable law or agreed to in writing, software
11+
* distributed under the License is distributed on an "AS IS" BASIS,
12+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13+
* See the License for the specific language governing permissions and
14+
* limitations under the License.
15+
*/
16+
117
.material-settings__api {
218
padding-left: 0;
319
padding-right: 0;
@@ -11,4 +27,8 @@
1127
height: 100%;
1228
width: 100%;
1329
}
30+
31+
& .mdc-action__remove {
32+
color: #dd5d5f;
33+
}
1434
}
Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,19 @@
1+
/**
2+
* Copyright 2021 Google LLC
3+
*
4+
* Licensed under the Apache License, Version 2.0 (the "License");
5+
* you may not use this file except in compliance with the License.
6+
* You may obtain a copy of the License at
7+
*
8+
* http://www.apache.org/licenses/LICENSE-2.0
9+
*
10+
* Unless required by applicable law or agreed to in writing, software
11+
* distributed under the License is distributed on an "AS IS" BASIS,
12+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13+
* See the License for the specific language governing permissions and
14+
* limitations under the License.
15+
*/
16+
117
.material-settings__cell--justify-end {
218
justify-self: flex-end;
319
}

plugin/assets/css/src/settings/index.css

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,19 @@
1+
/**
2+
* Copyright 2021 Google LLC
3+
*
4+
* Licensed under the Apache License, Version 2.0 (the "License");
5+
* you may not use this file except in compliance with the License.
6+
* You may obtain a copy of the License at
7+
*
8+
* http://www.apache.org/licenses/LICENSE-2.0
9+
*
10+
* Unless required by applicable law or agreed to in writing, software
11+
* distributed under the License is distributed on an "AS IS" BASIS,
12+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13+
* See the License for the specific language governing permissions and
14+
* limitations under the License.
15+
*/
16+
117
@import "./base.css";
218
@import "./updater.css";
319
@import "./switch.css";

plugin/assets/css/src/settings/switch.css

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,19 @@
1+
/**
2+
* Copyright 2021 Google LLC
3+
*
4+
* Licensed under the Apache License, Version 2.0 (the "License");
5+
* you may not use this file except in compliance with the License.
6+
* You may obtain a copy of the License at
7+
*
8+
* http://www.apache.org/licenses/LICENSE-2.0
9+
*
10+
* Unless required by applicable law or agreed to in writing, software
11+
* distributed under the License is distributed on an "AS IS" BASIS,
12+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13+
* See the License for the specific language governing permissions and
14+
* limitations under the License.
15+
*/
16+
117
.material-settings__switch {
218
align-items: center;
319
display: flex;
Lines changed: 18 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,26 @@
1+
/**
2+
* Copyright 2021 Google LLC
3+
*
4+
* Licensed under the Apache License, Version 2.0 (the "License");
5+
* you may not use this file except in compliance with the License.
6+
* You may obtain a copy of the License at
7+
*
8+
* http://www.apache.org/licenses/LICENSE-2.0
9+
*
10+
* Unless required by applicable law or agreed to in writing, software
11+
* distributed under the License is distributed on an "AS IS" BASIS,
12+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13+
* See the License for the specific language governing permissions and
14+
* limitations under the License.
15+
*/
16+
117
.material-settings__updater {
218
background-color: var(--material-design-settings-background-color);
319
border-radius: 8px;
420
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12);
521
margin-bottom: 15px;
622

7-
& .material-settings__message {
8-
align-items: center;
9-
color: var(--material-design-settings-error-color);
10-
display: flex;
11-
}
12-
13-
& .material-settings__message-text {
14-
font-size: 16px;
15-
font-weight: 500;
16-
margin-left: 10px;
23+
&.no__last-update .mdc-typography--headline6 {
24+
margin-bottom: 0;
1725
}
1826
}

plugin/assets/src/settings/components/index.js

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,19 @@
1+
/**
2+
* Copyright 2021 Google LLC
3+
*
4+
* Licensed under the Apache License, Version 2.0 (the "License");
5+
* you may not use this file except in compliance with the License.
6+
* You may obtain a copy of the License at
7+
*
8+
* http://www.apache.org/licenses/LICENSE-2.0
9+
*
10+
* Unless required by applicable law or agreed to in writing, software
11+
* distributed under the License is distributed on an "AS IS" BASIS,
12+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13+
* See the License for the specific language governing permissions and
14+
* limitations under the License.
15+
*/
16+
117
/**
218
* WordPress dependencies
319
*/
@@ -7,6 +23,7 @@ import { __ } from '@wordpress/i18n';
723
* Internal dependencies
824
*/
925
import { SettingsProvider } from '../context';
26+
import Errors from './errors';
1027
import Integrations from './integrations';
1128

1229
const Settings = () => {
@@ -16,6 +33,8 @@ const Settings = () => {
1633
{ __( 'Material Settings', 'material-design' ) }
1734
</h1>
1835

36+
<Errors />
37+
1938
<Integrations />
2039
</SettingsProvider>
2140
);

plugin/assets/src/settings/components/integrations/api.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -110,7 +110,7 @@ const Api = () => {
110110
</button>
111111
<button
112112
type="button"
113-
className="mdc-button mdc-dialog__button"
113+
className="mdc-button mdc-dialog__button mdc-action__remove"
114114
onClick={ removeApiKey }
115115
>
116116
<div className="mdc-button__ripple"></div>

plugin/assets/src/settings/components/integrations/index.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -78,6 +78,8 @@ const Integrations = () => {
7878
checked={ state.updaters[ key ].autoUpdates }
7979
lastUpdated={ state.updaters[ key ].lastUpdated }
8080
type={ UPDATERS[ key ].type }
81+
displayUpdatedOn={ UPDATERS[ key ].displayUpdatedOn }
82+
versionAvailable={ UPDATERS[ key ].versionAvailable }
8183
/>
8284
) ) }
8385
</div>

plugin/assets/src/settings/components/integrations/updater.js

Lines changed: 26 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,7 @@
1717
/**
1818
* External dependencies
1919
*/
20+
import classNames from 'classnames';
2021
import _uniqueId from 'lodash/uniqueId';
2122

2223
/**
@@ -35,7 +36,15 @@ import Switch from './switch';
3536
import Button from '../../../wizard/components/navigation/button';
3637
import { 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">

plugin/assets/src/settings/constants.js

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -51,6 +51,26 @@ export const UPDATERS = {
5151
updateAvailable: 'update' === getConfig( 'iconsUpdateStatus' ),
5252
autoUpdates: parseInt( getConfig( 'iconsAutoUpdate' ), 10 ),
5353
},
54+
PLUGIN: {
55+
title: __( 'Material Design Plugin', 'material-design' ),
56+
type: 'PLUGIN',
57+
lastUpdated: false,
58+
needsKey: false,
59+
updateAvailable: !! String( getConfig( 'pluginUpdateStatus' ) ),
60+
versionAvailable: getConfig( 'pluginUpdateStatus' ),
61+
autoUpdates: parseInt( getConfig( 'pluginAutoUpdate' ) || 0, 10 ),
62+
displayUpdatedOn: false,
63+
},
64+
THEME: {
65+
title: __( 'Material Design Theme', 'material-design' ),
66+
type: 'THEME',
67+
lastUpdated: false,
68+
needsKey: false,
69+
updateAvailable: !! String( getConfig( 'themeUpdateStatus' ) ),
70+
versionAvailable: getConfig( 'themeUpdateStatus' ),
71+
autoUpdates: parseInt( getConfig( 'themeAutoUpdate' ) || 0, 10 ),
72+
displayUpdatedOn: false,
73+
},
5474
};
5575

5676
export const KEY_PLACEHOLDER = '•••••••••••••••••••••••••••••';

0 commit comments

Comments
 (0)