onOffice-Web-Org / oo-wp-plugin

onOffice for WP-Websites
https://wp-plugin.onoffice.com
GNU General Public License v3.0
9 stars 9 forks source link

Make detail view shortcode work in ACF blocks #448

Closed jmaas-onoffice closed 1 year ago

jmaas-onoffice commented 1 year ago

Discussed in https://github.com/onOffice-Web-Org/oo-wp-plugin/discussions/431

Originally posted by **jmaas-onoffice** January 25, 2023 We will be using [ACF blocks](https://www.advancedcustomfields.com/resources/blocks/). Currently, when you enter the detail view shortcode in a page using ACF blocks, it is not detected. There is no other way to tell the plugin where the detail page is than to have it detect the shortcode. ## Cause Gutenberg stores the block content as HTML comments. In our case with ACF blocks, this could look like this: ``` ``` ACF stores everything inside that comment, which means it has to escape quotes. `[oo_estate view="detail"]` becomes `[oo_estate view=\u0022detail\u0022]`. The plugin only [checks](https://github.com/onOffice-Web-Org/oo-wp-plugin/blob/aca3729c9f67e5ede348dae23d2b6c6ec8ab1da1/plugin/Controller/DetailViewPostSaveController.php#L330) the [unescaped string](https://github.com/onOffice-Web-Org/oo-wp-plugin/blob/aca3729c9f67e5ede348dae23d2b6c6ec8ab1da1/plugin/Controller/DetailViewPostSaveController.php#L247). Therefore when the shortcode has escaped quotes, it is not detected properly. ## Proper unescaping is impossible in PHP There seems to be no function in PHP that will take the escaped quotes and turn them into proper quotes. For example, [`json_decode`](https://www.php.net/manual/de/function.json-decode) tries to decode into a JSON object and [`utf8_decode`](https://www.php.net/manual/de/function.utf8-decode.php) is deprecated (and does not even seem to do what we want). ## Simply replace escaped quotes Therefore the simplest solution seems to be to replace the escaped quotes, `\u0022`, with proper quotes, `"`, just before [checking whether it is the detail view shortcode](https://github.com/onOffice-Web-Org/oo-wp-plugin/blob/aca3729c9f67e5ede348dae23d2b6c6ec8ab1da1/plugin/Controller/DetailViewPostSaveController.php#L330).
dai-eastgate commented 1 year ago

@jmaas-onoffice The Advanced Custom Fields block only integrates with ACF pro, can you give me the package of this version so that I can install and test it directly.

jmaas-onoffice commented 1 year ago

@dai-eastgate I'm unsure how the license works and you'd also need to set up the block. Can you test it by going into the code editor in Gutenberg (Ctrl+Shift+Alt+M) and pasting this block markup?

<!-- wp:onoffice/estate-list {"name":"onoffice/estate-list","data":{"type":"detail","_type":"field_61e9245a7717f","shortcode":"[oo_estate view=\u0022detail\u0022]","_shortcode":"field_619cca1ab882e","settings_bg_color":"white","_settings_bg_color":"field_6114d42173d5a","settings":"","_settings":"field_61a7a5fa927bd"},"mode":"auto"} /-->

Even though it will probably say that the block is invalid, maybe this is enough to test whether the plugin detects it?

dai-eastgate commented 1 year ago

image image @jmaas-onoffice I tried to add as you said, but i find that we need to create block field in advance custom field. you can watch this video tutorial below https://www.youtube.com/watch?v=z6hEogjGD1U Right now i don't have advanced custom field professional plugin installation package for testers Because I haven't created a block yet, it says that block doesn't exist

jmaas-onoffice commented 1 year ago

@dai-eastgate But does the plugin detect the detail page, even if the block is "invalid"? I think this might already work for testing and you don't need to build the block. Could you try?

dai-eastgate commented 1 year ago

@jmaas-onoffice I tried to test as you said, and the plugin detected the detail page. You can watch the video below and give me feedback.

https://user-images.githubusercontent.com/106214469/220294381-7ce3bd9e-d58e-4acb-84c0-04b1b65aaac2.mp4

jmaas-onoffice commented 1 year ago

You are not using the comment tag, <!--. When I test it with the comments, which is how Gutenberg stores blocks, then it does not work.

Also I think that we need to change how the detail view is detected when a post is saved. I have tried it and pushed https://github.com/onOffice-Web-Org/oo-wp-plugin/commit/f42d5053065495addd8693fb09e2d65201086237 which works in my test.

So I'll close the PR.