Skip to content

Commit ce8013e

Browse files
kaeizenkaeizen
committed
updates
- remove "Stackable" from design labels - update tooltip for style options - update checking of image if it's already in media library
1 parent 86c02b2 commit ce8013e

File tree

7 files changed

+74
-51
lines changed

7 files changed

+74
-51
lines changed

‎src/components/design-library-list/index.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -58,7 +58,7 @@ const DesignLibraryList = props => {
5858
plan={ design.plan }
5959
designId={ design.designId }
6060
label={ design.title }
61-
category={ design.categories[ 0 ] }
61+
category={ design.category }
6262
containerScheme={ props.containerScheme }
6363
backgroundScheme={ props.backgroundScheme }
6464
enableBackground={ props.enableBackground }

‎src/components/modal-design-library/block-list.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ const BlockList = props => {
2828
useEffect( () => {
2929
let total = 0
3030
const _categories = designs.reduce( ( output, design ) => {
31-
const category = design.categories[ 0 ]
31+
const category = design.category
3232

3333
if ( plan && plan !== design.plan ) {
3434
return output

‎src/components/modal-design-library/editor.scss‎

Lines changed: 19 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -66,6 +66,20 @@
6666
background: #fff;
6767
border-top: 1px solid #eee;
6868

69+
> div:first-child {
70+
display: flex;
71+
align-items: center;
72+
gap: 4px;
73+
margin-bottom: 1em;
74+
h4 {
75+
margin: 0;
76+
}
77+
svg {
78+
fill: #bbb;
79+
cursor: pointer;
80+
}
81+
}
82+
6983
.components-base-control__field {
7084
display: flex;
7185
justify-content: space-between;
@@ -438,4 +452,8 @@ div.ugb-modal-design-library__enable-background {
438452
.ugb-design-library__manage-scheme {
439453
display: block;
440454
text-align: center;
441-
}
455+
}
456+
457+
.ugb-modal-design-library__style-options-tooltip .stk-tooltip__text a {
458+
display: inline;
459+
}

‎src/components/modal-design-library/images/help.svg‎

Lines changed: 1 addition & 0 deletions
Loading

‎src/components/modal-design-library/modal.js‎

Lines changed: 16 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
/**
22
* Internal deprendencies
33
*/
4+
import HelpSVG from './images/help.svg'
45
import BlockList from './block-list'
56
import Button from '../button'
67
// import AdvancedToolbarControl from '../advanced-toolbar-control'
@@ -195,25 +196,28 @@ export const ModalDesignLibrary = props => {
195196
/>
196197
</div>
197198
<div className="ugb-modal-design-library__style-options">
198-
<h4 style={ { margin: '0 0 1em ' } }>{ __( 'Style Options', i18n ) }</h4>
199+
<div>
200+
<h4>{ __( 'Style Options', i18n ) }</h4>
201+
<Tooltip className="ugb-modal-design-library__style-options-tooltip" placement="top" text={ <>
202+
{ __( 'Customize patterns using the options below.', i18n ) }
203+
&nbsp;
204+
<a href="https://docs.wpstackable.com/article/343-using-the-design-library#Design-Library-Style-Options-Pswi5" target="_docs">
205+
{ __( 'Learn how to use style options.', i18n ) }
206+
</a>
207+
</> }>
208+
<HelpSVG height="14px" width="14px" />
209+
</Tooltip>
210+
</div>
199211
<ToggleControl
200212
className="ugb-modal-design-library__enable-background"
201-
label={ <Tooltip placement="top" text={ <a href="https://docs.wpstackable.com/article/343-using-the-design-library#Section-Background-KYOys" target="_docs">
202-
{ __( 'Learn more about section background here.', i18n ) }
203-
</a> }>
204-
<span className="stk-control__label--has-tooltip"> { __( 'Section Background', i18n ) }</span>
205-
</Tooltip> }
213+
label={ __( 'Section Background', i18n ) }
206214
checked={ enableBackground }
207215
onChange={ value => {
208216
setEnableBackground( value )
209217
} }
210218
/>
211219
<BaseControl
212-
label={ <Tooltip placement="top" text={ <a href="https://docs.wpstackable.com/article/343-using-the-design-library#Background-Scheme-Wn_CV" target="_docs">
213-
{ __( 'Learn more about background schemes here.', i18n ) }
214-
</a> }>
215-
<span className="stk-control__label--has-tooltip">{ __( 'Background Scheme', i18n ) }</span>
216-
</Tooltip> }
220+
label={ __( 'Background Scheme', i18n ) }
217221
className="ugb-modal-design-library__color-scheme-label"
218222
>
219223
<Dropdown
@@ -282,11 +286,7 @@ export const ModalDesignLibrary = props => {
282286
/>
283287
</BaseControl>
284288
<BaseControl
285-
label={ <Tooltip placement="top" text={ <a href="https://docs.wpstackable.com/article/343-using-the-design-library#Container-Scheme-HyK91" target="_docs">
286-
{ __( 'Learn more about container schemes here.', i18n ) }
287-
</a> }>
288-
<span className="stk-control__label--has-tooltip">{ __( 'Container Scheme', i18n ) }</span>
289-
</Tooltip> }
289+
label={ __( 'Container Scheme', i18n ) }
290290
className="ugb-modal-design-library__color-scheme-label"
291291
>
292292
<Dropdown

‎src/design-library/index.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -67,7 +67,7 @@ export const filterDesigns = async ( {
6767
}
6868

6969
if ( isCategory ) {
70-
library = library.filter( ( { categories } ) => categories[ 0 ] === isCategory )
70+
library = library.filter( ( { category } ) => category === isCategory )
7171
}
7272

7373
return library

‎src/design-library/init.php‎

Lines changed: 35 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -143,34 +143,17 @@ public function delete_cache() {
143143
public function get_design_library_image( $request ) {
144144
$url = $request->get_param( 'image_url' );
145145

146-
$temp_filepath = download_url( $url );
147-
148-
if ( is_wp_error( $temp_filepath ) ) {
149-
return new WP_REST_Response( array(
150-
'success' => false,
151-
'message' => 'Failed to retrieve image from the provided URL.'
152-
), 500 );
153-
}
154-
155-
if ( ! file_exists( $temp_filepath ) || ! wp_filesize( $temp_filepath ) ) {
156-
@unlink( $temp_filepath );
157-
return new WP_REST_Response( array(
158-
'success' => false,
159-
'message' => 'Invalid file content retrieved from the provided URL.'
160-
), 400 );
161-
}
162-
163-
$image_hash = hash_file( 'md5', $temp_filepath );
146+
$basename = sanitize_file_name( wp_basename( parse_url( $url, PHP_URL_PATH ) ) );
164147

165148
$args = array(
166149
'post_type' => 'attachment',
167150
'post_status' => 'inherit',
168151
'posts_per_page' => 1,
169152
'meta_query' => array(
170153
array(
171-
'key' => 'stk_image_hash',
172-
'value' => $image_hash,
173-
'compare' => '='
154+
'key' => '_wp_attached_file',
155+
'value' => $basename,
156+
'compare' => 'LIKE'
174157
)
175158
)
176159
);
@@ -183,7 +166,6 @@ public function get_design_library_image( $request ) {
183166
$media_url = wp_get_attachment_url( $media_id );
184167

185168
wp_reset_postdata();
186-
@unlink( $temp_filepath );
187169

188170
return new WP_REST_Response( array(
189171
'success' => true,
@@ -192,10 +174,27 @@ public function get_design_library_image( $request ) {
192174
), 200 );
193175
}
194176

177+
$temp_filepath = download_url( $url );
178+
179+
if ( is_wp_error( $temp_filepath ) ) {
180+
return new WP_REST_Response( array(
181+
'success' => false,
182+
'message' => 'Failed to retrieve image from the provided URL.'
183+
), 500 );
184+
}
185+
186+
if ( ! file_exists( $temp_filepath ) || ! wp_filesize( $temp_filepath ) ) {
187+
@unlink( $temp_filepath );
188+
return new WP_REST_Response( array(
189+
'success' => false,
190+
'message' => 'Invalid file content retrieved from the provided URL.'
191+
), 400 );
192+
}
193+
195194
$valid_mimes = [ 'image/jpeg' => 1, 'image/jpg' => 1, 'image/png' => 1, 'image/gif' => 1, 'image/webp' => 1, 'video/mp4' => 1 ];
196195

197196
$file_array = array(
198-
'name' => sanitize_file_name( wp_basename( parse_url( $url, PHP_URL_PATH ) ) ),
197+
'name' => $basename,
199198
'type' => mime_content_type( $temp_filepath ),
200199
'tmp_name' => $temp_filepath,
201200
'size' => wp_filesize( $temp_filepath )
@@ -230,7 +229,6 @@ public function get_design_library_image( $request ) {
230229
), 500 );
231230
}
232231

233-
update_post_meta( $media_id, 'stk_image_hash', $image_hash );
234232
$media_url = wp_get_attachment_url( $media_id );
235233

236234
return new WP_REST_Response( array(
@@ -297,7 +295,7 @@ public function _get_design_library( $outside_init = false ) {
297295
$block_patterns = WP_Block_Patterns_Registry::get_instance()->get_all_registered( $outside_init );
298296
foreach ( $block_patterns as $pattern ) {
299297
if ( strpos( $pattern[ 'name' ], 'stackable/' ) !== false ) {
300-
$pattern[ 'categories' ][ 0 ] = str_replace( 'stackable/', '', $pattern[ 'categories' ][ 0 ] );
298+
$pattern[ 'title' ] = str_replace( sprintf( __( 'Stackable ', STACKABLE_I18N ) ), '', $pattern[ 'title' ] );
301299
$content[ $pattern[ 'designId' ] ] = $pattern;
302300
}
303301
}
@@ -369,9 +367,9 @@ public function get_premium_designs( $content ) {
369367
}
370368

371369
$premium_designs[ $design_id ] = array(
372-
'title' => sprintf( __( 'Stackable %s', STACKABLE_I18N ), $design[ 'label' ] ),
370+
'title' => $design[ 'label' ],
373371
'content' => $design[ 'template' ],
374-
'categories' => array( $design[ 'category' ], 'stackable' ),
372+
'category' => $design[ 'category' ],
375373
'description' => $design[ 'description' ],
376374
'plan' => $design[ 'plan' ],
377375
'designId' => $design_id
@@ -399,9 +397,9 @@ public function get_designs_with_disabled_blocks( $content ) {
399397
}
400398

401399
$designs_with_disabled[ $design_id ] = array(
402-
'title' => sprintf( __( 'Stackable %s', STACKABLE_I18N ), $design[ 'label' ] ),
400+
'title' => $design[ 'label' ],
403401
'content' => $design[ 'template' ],
404-
'categories' => array( $design[ 'category' ], 'stackable' ),
402+
'category' => $design[ 'category' ],
405403
'description' => $design[ 'description' ],
406404
'plan' => $design[ 'plan' ],
407405
'designId' => $design_id,
@@ -417,6 +415,11 @@ public function get_designs_with_disabled_blocks( $content ) {
417415
return $merged;
418416
}
419417

418+
public function get_category_kebab_case( $category ) {
419+
$category = trim( strtolower( $category ) );
420+
return preg_replace( '/[^a-z0-9-]+/', '-', $category );
421+
}
422+
420423
public function register_design_pattern() {
421424
$designs = $this->get_design_library_from_cloud();
422425

@@ -441,7 +444,7 @@ public function register_design_pattern() {
441444
if ( $has_disabled ) continue;
442445
}
443446

444-
register_block_pattern_category( 'stackable/' . $design[ 'category' ], [
447+
register_block_pattern_category( 'stackable/' . $this->get_category_kebab_case( $design[ 'category' ] ), [
445448
'label' => sprintf( __( 'Stackable %s', STACKABLE_I18N ), $design[ 'category' ] ),
446449
'description' => sprintf( __( '%s patterns for Stackable Design Library', STACKABLE_I18N ), $design[ 'category' ] ),
447450
] );
@@ -451,7 +454,8 @@ public function register_design_pattern() {
451454
array(
452455
'title' => sprintf( __( 'Stackable %s', STACKABLE_I18N ), $design[ 'label' ] ),
453456
'content' => $design[ 'template' ],
454-
'categories' => array( 'stackable/' . $design[ 'category' ], 'stackable' ),
457+
'categories' => array( 'stackable/' . $this->get_category_kebab_case( $design[ 'category' ] ), 'stackable' ), // used in Patterns
458+
'category' => $design[ 'category' ], // used in Design Library
455459
'description' => $design[ 'description' ],
456460
'plan' => $design[ 'plan' ],
457461
'designId' => $design_id

0 commit comments

Comments
 (0)