PluginProbe
Image Optimizer – Compress Images and Convert to WebP or AVIF / 1.7.7
Image Optimizer – Compress Images and Convert to WebP or AVIF v1.7.7
1.7.7 1.7.6 1.7.5 1.7.4 trunk 1.0.0 1.0.1 1.0.2 1.1.0 1.2.0 1.2.1 1.3.0 1.4.0 1.4.1 1.5.0 1.5.1 1.5.2 1.5.3 1.5.4 1.6.0 1.6.1 1.6.2 1.6.3 1.6.4 1.6.5 All 33 releases
← All changes | modules/optimization/assets/js/templates/list-view/index.js +12 -14 1.3.0 → 1.7.7 View file →
@@ -1,8 +1,8 @@
1 1 import { __ } from '@wordpress/i18n';
2 2 import { escapeHTML } from '@wordpress/escape-html';
3 3 import { formatFileSize } from '../../utils';
4 -import { UPGRADE_LINK } from '../../constants';
4 +import { getErrorButton } from '../common';
5 5
6 6 const notOptimizedTemplate = () => {
7 7 return `
8 8 <button type="button"
@@ -39,23 +39,13 @@
39 39 </button>
40 40 `;
41 41 };
42 42
43 -const errorTemplate = ( message, imagesLeft ) => {
43 +const errorTemplate = ( { message, imagesLeft, errorType, allowRetry } ) => {
44 44 return `
45 45 <span class="image-optimization-control__error-message">${ escapeHTML( message ) }</span>
46 46
47 - ${ imagesLeft === 0
48 - ? `<a class="button button-secondary button-large image-optimization-control__button"
49 - href="${ UPGRADE_LINK }"
50 - target="_blank" rel="noopener noreferrer">
51 - ${ __( 'Upgrade', 'image-optimization' ) }
52 - </a>
53 - ` : `
54 - <button class="button button-secondary button-large button-link-delete image-optimization-control__button image-optimization-control__button--try-again"
55 - type="button">
56 - ${ __( 'Try again', 'image-optimization' ) }
57 - </button>` }
47 + ${ getErrorButton( { imagesLeft, errorType, allowRetry } ) }
58 48 `;
59 49 };
60 50
61 51 const optimizedTemplate = ( data ) => {
@@ -64,9 +54,17 @@
64 54 return `
65 55 <p class="image-optimization-control__property">
66 56 ${ __( 'Image sizes optimized', 'image-optimization' ) }:
67 57
68 - <span>${ data?.sizesOptimized }</span>
58 + <span>
59 + ${ data?.sizesOptimized }/${ data?.sizesTotal }
60 +
61 + <button type="button"
62 + class="image-optimization-control__details-button"
63 + aria-label="${ __( 'Open optimization details', 'image-optimization' ) }">
64 + (+)
65 + </button>
66 + </span>
69 67 </p>
70 68
71 69 <p class="image-optimization-control__property">
72 70 ${ data?.saved?.absolute !== 0