Skip to content

fix: ensure WooCommerce cart store availability before adding items to cart#1733

Merged
subodhr258 merged 4 commits intofeat/godam-woocommerce-integrationfrom
fix/add-to-cart
Apr 15, 2026
Merged

fix: ensure WooCommerce cart store availability before adding items to cart#1733
subodhr258 merged 4 commits intofeat/godam-woocommerce-integrationfrom
fix/add-to-cart

Conversation

@KMchaudhary
Copy link
Copy Markdown
Collaborator

@KMchaudhary KMchaudhary commented Mar 16, 2026 •
edited
Loading

Fixes:

Bug : In GoDAM Gallery Block, Video with Woo Layer has failure in add-to-cart activity.

Ref: https://docs.google.com/document/d/1KDpp3WxD6g8c0_J-p9SR5PzO148xZbgF3V97gyMmWOs/edit?tab=t.y19cn2tdynpw

This pull request focuses on improving the integration between the Godam Player and WooCommerce, specifically ensuring reliable access to the WooCommerce cart store and handling cases where it may not be available. The changes also add necessary dependencies to support this functionality.

Enhancements to WooCommerce integration:

  • Added a runtime check in WooCommerceLayerManager to verify that the WooCommerce cart store (wc/store/cart) and its addItemToCart method are available before attempting to add items. If unavailable, a user-friendly error message is shown and the UI is reset.
  • Updated script registration in class-godam-player.php to include the wc-blocks-data-store dependency when WooCommerce is active, ensuring the cart store is loaded and available for frontend scripts.

Dependency updates:

  • Added @wordpress/data as a project dependency in package.json to support interaction with WordPress data stores, such as the WooCommerce cart store.

Demo

Screen.Recording.2026-03-16.at.8.05.19.PM.mov

@github-actions
Copy link
Copy Markdown

github-actions bot commented Mar 16, 2026

🔍 WordPress Plugin Check Report

⚠️ Status: Passed with warnings

📊 Report

🎯 Total Issues ❌ Errors ⚠️ Warnings
67 0 67

⚠️ Warnings (67)

📁 composer.json (1 warning)
📍 Line 🔖 Check 💬 Message
0 missing_composer_json_file The "/vendor" directory using composer exists, but "composer.json" file is missing.
📁 readme.txt (2 warnings)
📍 Line 🔖 Check 💬 Message
0 mismatched_plugin_name Plugin name "GoDAM - Organize WordPress Media Library & File Manager with Unlimited Folders for Images, Videos & more" is different from the name declared in plugin header "GoDAM".
0 trademarked_term The plugin name includes a restricted term. Your chosen plugin name - "GoDAM - Organize WordPress Media Library & File Manager with Unlimited Folders for Images, Videos & more" - contains the restricted term "wordpress" which cannot be used at all in your plugin name.
📁 assets/build/integrations/woocommerce/blocks/godam-reel-pops/render.php (11 warnings)
📍 Line 🔖 Check 💬 Message
23 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$attributes".
57 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$valid_videos".
69 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$video_ids".
71 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$video_id".
72 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$video_ids".
76 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$shortcode_atts".
97 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$shortcode_parts".
98 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$key".
98 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$value".
100 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$shortcode_parts".
104 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$shortcode".
📁 integrations/woocommerce/templates/sidebar/hero-product.php (3 warnings)
📍 Line 🔖 Check 💬 Message
19 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$product_url".
20 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$product_name".
21 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$product_img".
📁 integrations/woocommerce/templates/sidebar/single-product-details.php (18 warnings)
📍 Line 🔖 Check 💬 Message
18 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$product_images".
21 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$main_image_id".
23 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$main_image_url".
25 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$product_images".
30 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$gallery_image_ids".
31 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$gallery_image_id".
32 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$gallery_image_url".
34 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$product_images".
40 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$product_images".
43 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$average".
44 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$rating_count".
46 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$full_star_svg".
51 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$empty_star_svg".
57 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$allowed_svg".
98 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$index".
98 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$image_url".
121 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$i".
128 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$partial".
📁 integrations/woocommerce/templates/sidebar/multiple-products-list.php (8 warnings)
📍 Line 🔖 Check 💬 Message
21 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$product".
37 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$average".
38 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$rating_count".
40 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$full_star_svg".
45 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$empty_star_svg".
51 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$allowed_svg".
81 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$i".
88 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$partial".
📁 integrations/woocommerce/blocks/godam-reel-pops/render.php (11 warnings)
📍 Line 🔖 Check 💬 Message
23 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$attributes".
57 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$valid_videos".
69 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$video_ids".
71 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$video_id".
72 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$video_ids".
76 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$shortcode_atts".
97 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$shortcode_parts".
98 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$key".
98 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$value".
100 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$shortcode_parts".
104 WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound Global variables defined by a theme/plugin should start with the theme/plugin prefix. Found: "$shortcode".
📁 assets/build/css/main.css (1 warning)
📍 Line 🔖 Check 💬 Message
0 EnqueuedStylesScope This style is being loaded in all contexts.
📁 assets/src/libs/analytics.min.js (6 warnings)
📍 Line 🔖 Check 💬 Message
0 EnqueuedScriptsScope This script is being loaded in all frontend contexts.
0 NonBlockingScripts.NoStrategy This script on http://localhost:8880 (with handle analytics-library) is loaded in the footer. Consider a defer or async script loading strategy instead.
0 NonBlockingScripts.NoStrategy This script on http://localhost:8880/2026/03/16/hello-world/ (with handle analytics-library) is loaded in the footer. Consider a defer or async script loading strategy instead.
0 NonBlockingScripts.NoStrategy This script on http://localhost:8880/sample-page/ (with handle analytics-library) is loaded in the footer. Consider a defer or async script loading strategy instead.
0 NonBlockingScripts.NoStrategy This script on http://localhost:8880/demo-attachment-post/ (with handle analytics-library) is loaded in the footer. Consider a defer or async script loading strategy instead.
0 NonBlockingScripts.NoStrategy This script on http://localhost:8880/?godam-video=demo-godam-video-post (with handle analytics-library) is loaded in the footer. Consider a defer or async script loading strategy instead.
📁 assets/build/js/main.min.js (6 warnings)
📍 Line 🔖 Check 💬 Message
0 EnqueuedScriptsScope This script is being loaded in all frontend contexts.
0 NonBlockingScripts.NoStrategy This script on http://localhost:8880 (with handle rtgodam-script) is loaded in the footer. Consider a defer or async script loading strategy instead.
0 NonBlockingScripts.NoStrategy This script on http://localhost:8880/2026/03/16/hello-world/ (with handle rtgodam-script) is loaded in the footer. Consider a defer or async script loading strategy instead.
0 NonBlockingScripts.NoStrategy This script on http://localhost:8880/sample-page/ (with handle rtgodam-script) is loaded in the footer. Consider a defer or async script loading strategy instead.
0 NonBlockingScripts.NoStrategy This script on http://localhost:8880/demo-attachment-post/ (with handle rtgodam-script) is loaded in the footer. Consider a defer or async script loading strategy instead.
0 NonBlockingScripts.NoStrategy This script on http://localhost:8880/?godam-video=demo-godam-video-post (with handle rtgodam-script) is loaded in the footer. Consider a defer or async script loading strategy instead.

🤖 Generated by WordPress Plugin Check Action • Learn more about Plugin Check

Copilot AI reviewed Mar 23, 2026
View reviewed changes
Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR improves the GoDAM Player’s WooCommerce “add to cart” behavior by ensuring the WooCommerce cart data store is available before attempting to dispatch cart actions, and by adjusting script dependencies so the store is more likely to be present when the player runs.

Changes:

  • Add a runtime guard in WooCommerceLayerManager to verify the WooCommerce cart store/action exists before calling addItemToCart.
  • Update the player shortcode script registration to append wc-blocks-data-store when WooCommerce is active.
  • Add @wordpress/data to npm dependencies to support dispatch() usage.

Reviewed changes

Copilot reviewed 3 out of 4 changed files in this pull request and generated 3 comments.

File Description
package.json Adds @wordpress/data to support interacting with WP/Woo data stores.
package-lock.json Lockfile updates reflecting the new dependency resolution.
inc/classes/shortcodes/class-godam-player.php Conditionally adds wc-blocks-data-store as a script dependency for the player frontend bundle.
assets/src/js/godam-player/managers/layers/wooCommerceLayerManager.js Adds a guard to prevent calling addItemToCart when the cart store isn’t available.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment thread inc/classes/shortcodes/class-godam-player.php Outdated
Comment thread package.json
Comment thread inc/classes/shortcodes/class-godam-player.php Outdated
@subodhr258
Copy link
Copy Markdown
Collaborator

subodhr258 commented Apr 14, 2026 •
edited
Loading

Found 2 issues with the Woo layer in Gallery currently:

  1. When I clicked on the + icon without the Mini Cart, it opened in a new page. (This issue occurs on GoDAM Video block as well.) I need to know if this is expected. If yes then we should add a help text that if mini cart is disabled then "Add to Cart" button will redirect to the cart page.
  2. When mini cart is opened in the GoDAM Gallery, it has a black background and accessibility issues.

Recording:

Screen.Recording.2026-04-14.at.7.59.08.PM.mov

@subodhr258 subodhr258 merged commit 082c75f into feat/godam-woocommerce-integration Apr 15, 2026
2 of 3 checks passed
@subodhr258 subodhr258 deleted the fix/add-to-cart branch April 15, 2026 14:45
subodhr258 added a commit that referenced this pull request Apr 17, 2026
@rudrakshi-gupta @vk17-starlord
@OpuRockey @sabbir1991 @KMchaudhary @subodhr258
Feat: WooCommerce-GoDAM Integration (#1617)
87e0dbb 
* WooCommerce Integration:

- Fix Open Photo slider issue for featured video gallery
- Fix empty video id issue in thmbnails gallery for featured video gallery
- Fix CSS for single product story

* Woocommerce Integration fixes:

- Fix the styling issue of featured video image on Open Swipe Modal
- Fix position of close button for video popup on mobile screens for Product Gallery Block
- Add ellipsis for product name in sidebar of Product gallery block if it exceeds 1 line

* WooCommerce Integration fixes: Style poster image and add ellipsis in product name

* WooCommerce Integration: Remove sidebar closing functionality

* Fixed responsiveness issues for product video modal

* fixed phpcs issues for video gallery modal

* fixed control bar and width of video popup in single-product-gallery

* Move cta background color above product name font size in CTA settings

* fix close button position and border-radius for video modal

* change selector for godam-share-button to adjust its position with close button

* fix width issue for share modal container in video-popup

* Add Support for close button's position in Single Product Page Story for transcoded videos

* fix spacing issues and minor early return checks

* Refactor array formatting in video gallery methods for improved readability

* Improve code formatting for readability in video gallery class

* Update is_transcoded logic in video gallery class to use transcoded URL check

* Adjust position of share button in video gallery modal for better alignment

* Enhance product video features with better UI, error handling, and code clarity based on feedback

* Fixes :
    - Extra wrapper of parsePx
    - Internationalization and linting
    - Proper comments and logs
    - Break large codes into modules
    - Enqueue of godam Player files on all pages

* Add 400 status for wp_json_send_error()

* Fix parentheses missing error in CSS

* Updated single product gallery view

* Enhance video modal: responsive height, Escape key close, improved CTA data, conditional class for transcoded videos.

* Fixes in Woocommerce Layer:

- Make Layer top bar time field editable
- Add info for users for color change of Product Hotspots
- Resolve video editor's Save button overlapping the layer settings
- Fix Cart position in teh editor
- Add Links to product on image and name when add to cart is enabled
- Resolve Products and other hotspots are overlapping each other
- Add confirmation message on the Layer when product gets added to Mini Cart
- Ensure that all product images within the layer maintain the same aspect ratio

Fix #1115

* Update video modal styles: adjust min and max heights for transcoded content and video container to improve responsiveness.

* Added mini slider under prouct image on reel modal

* Fixed mobile design for Reel modal

* Fix:

- [Admin Video Gallery Metabox] Hide the engagment and share button from Add Products
- [GoDAM Product Gallery] Restrict font size for mini Cart Badge
- [Admin Video Gallery Metabox] Fix portrait video display in Add Products
- [Admin Video Gallery Metabox] Add validation for Timestamps in Add Products
- [GoDAM Product Gallery, WooCommerce Layer] Add stock information and display view option for out of stock products
- [WooCommerce Layer] Update product hotspot's info when a product gets updated

Fix #1115

* Updated add to cart dispatch function for variation

* GoDAM Product Gallery fixes :

- Fix product title and link animation in safari browser for CTA
- Fix the timestamped video running in the CTA deopdown in safari

Fix #1115

* Fix engagment data and display for comments for single product sidebar in GoDAM Product Story

* Fix position of close button for Product Story

* [WooCommerce Integration] Remove enagements from Woocommerce and add engagements as a variable in video-shortcode

* Fixed palyer forward backward button position on reels modal

* GoDAM Product Gallery Fixes:

- Remove share button support for close button
- Add ESC key on closing the modal
- Remove engagments CSS

Fix #1115

* Add closing of Product Story Modal using ESC button

* Woocommerce Integration fixes :

- [GoDAM Product Gallery Block] Add ratings in sidebar and CTA
- [GoDAM Featured Gallery Video] Add CSS for close button
- [WooCommerce Layer] Fix Toast message to display correctly in safari

Fix #1115

* [GoDAM Product Story] Fix modal issue on single video in carousel

* [WooCommerce Integration] : Fix PHPCS errors and warnings

* Fix PHPCS warning

* [GoDAM Product Gallery] : Remove videos from carousel if the product is permanently deleted

Fix: #1115

* [WooCommerce Integration] : Add fullscreen CSS and fix misc errors

* Make Product Hotspot Name Editable in the Video Editor

* Fix the layer[type] condition in woocommerce layer

* WooCommerce Integration feat and fixes:

- [GoDAM WooCommerce Integration Admin] Add spinner and overlay in Video Gallery metabox to show loading process
- [GoDAM Featured video Gallery] Fix thumbnail sizes of video using CSS
- [WooCommerce Layer] Show proper cart message for Out of Stock Products
- [WC Add to Product Admin] Fix broken CSS of search bar and Save button

Fix #1115

* GoDAM WooCommerce Product gallery Fixes:

- Fix issues caused by trased product ids in multiple products section
- Remove the videos and products from the carousel if they are in trash

Fix #1115

* Resolve PHPCS warnings

* Fixe player control issue on single product page slider

* [WooCommerce Integration Admin] : Resolve the selection issue of product in Add to Product section

* WooCommerce Layer: Disable enter for auto-search Select Product ComboBox

* Check for WooCommerce integration not getting triggered when WooCommerce is not active

* Refactor API logic for Multisite support in WooCommerce Integration

* Add godam_ prefix to WooCommerce Layer in the Player file

* Fix PHPCS:

- NonPrefixedVariableFound erros
- MissingUnslash error
- slow_db_query_meta_key error
- EnqueuedScriptsScope error
- EnqueuedStylesScope error

* Patch: Fix Playback controls and Floating mobile CTA CSS for Product Page Reel

* Patch: Fratured Gallery Reels

- Fix skin CSS in videos for featured video
- Add autoplay feature to featured videos when clicked

* Patch: Removal of unwanted code

* Patch : WooCommerce Layer

- Remove query parameters from the cart url after a product has been added
- Enqueue Page level js files for WooCommerce Layer

* - Merge branch develop with branch feat/woocommerce-godam-integration
- Fix product hotspot poitioning issue in WooCommerece Layer

* Remove commented CSS rules

* Resolve PHPCS erros and add missing_direct_file_access_protection check

* Moved woocommerce to new integration folder

* Fixed some minor issues and moved pages components into hooks

* Fixed product hotspot related issues

* Updated image loading

* Added image loading

* Optimize js build

* Optimize js build with layer

* Fixed modal loader on frontend

* Refactor admin asset loading for WooCommerce integration

* Improve video gallery asset loading and carousel logic

* Fixed media opening issues on product edit gallery

* Revamp GoDAM Product Gallery:

- Change random value of product attribute from 5 to 8
- Resolve conflicting CSS for video modal sidebar's buttons and links when two or more Gallery block is added on the same page
- Resolve wrong Sidebar issue on Gallery block
- Resolve Timestamped Dropdown video Modal issue with rendering
- Fix shortcode implementation way where play button is not appearing
- Fix conflicting CSS for video modal in mobile view
- Video Modal issue in Safari browser
- Issue with Timestamped Video Modals in cloned dropdown
- Issue with Aspect ratio of Videos in the Gallery in mobile and desktop

Refs rtCamp/godam-core#733

* Revamp GoDAM Product Galley: Fix the issue with SVG in the Sidebar of Video Modal

Refs rtCamp/godam-core#733

* Refactor the product saving mechanism with video id

* Fixed on delete videos ids logic

* Fixed hotspot loading logic

* Added product fetch api handler

* Fixed product hotspot dynamic loading issue

* Fixed video gallery shortcode rendering optmization

* Ensure Card Size Compatibility in GoDAM Product Gallery Layout:

- Add 2 new Card Size settings (Tablet & Mobile) for Product Gallery in carousel
- Replace rem units with vw where applicable
- Add 2 new settings for grid columns based on device type
- Fix Issue with Resposible grid videos based on device with CSS
- Ensure images and videos scale proportionally in carousel and grid

Refs rtCamp/godam-core#732

* Fixed product rendering issue

* Make minor changes:

- Replace Experimental APIs with stable APIs
- Combine attributes in one object for gutenberg
- Change intval to floatval for float attributes
- Incorporate blockId attribute which uses clientId for tHE Gallery
- Replace filter_var with wp_validate_boolean
- Fix arrow visibility attribute bug of always truthy

* Toggle CTA on Mobile :

- Create Closing CTA toggle functionality only in mobile
- Add Toggle too it with Opening functionality button
- Style the Dropdown button with proper svg and basic CSS

Refs rtCamp/godam-core#734

* Add helper for asset versioning and update script loading

* Add caching for WooCommerce product REST endpoints

* Fixed JS setTimeInterval memory leak issues

* Added preload none for reducing page load perfromance

* Optimize cart add-to-cart and carousel video loading

* Fixed phpcs issues

* Refactor WooCommerce integration loading

* Added and updated readme for development

* Create a new GoDAM Product Gallery specific player skin

- Add a new SCSS file:godam-reels-skin for the Gallery
- Style out every control and main play button
- Add new godam-context attribute for product gallery and skin initalization

Refs rtCamp/godam-core#770

* Minor fixes:

- Remove unnecessary code
- Add wp_kses_post to minicart html
- Add a conditional check which helps to check null checking

* Restructure Reels skin CSS and remove null attribute

* Fix double quotes PHPCS issue

* Revamp GoDAM Product Gallery:

- Change name for Gallery settings and Video Meta box in the backend
- Change default value for Enable CTA and View Ratio
- Refactor all GoDAM Product Gallery Settings into separate Panels
- Adjust breakpoints for Video Modal in Tablets

Refs Refs rtCamp/godam-core#733

* Fix GoDAM Product Gallery Settings Layout

* ReVamp GoDAM Product Gallery:

- Make video modal popup settings Global
- Add a new settings with Integrations based data
- Add Product Modal Popup style and layout settings

Refs rtCamp/godam-core#733

* ReVAMP GoDAM Product Gallery:

- Design GoDAM Product Gallery frontend modal based on figma design
- Change default sizes of card in carousel
- Remove unnecessary code and fix misspelled words and attributes

Refs rtCamp/godam-core#733

* ReVamp Product Gallery:

- Add scroll animation on cta dropdown
- Fix dropdown modal opening direction and fix its CSS
- Change default sizes of card in carousel
- Add block attribute wrapper support to the gallery
- Add new settings for price and cart & dropdown modals
- Implement new UI for the product gallery
- Sanitize shotcode attributes properly
- Fix PHPCS Issues

Ref rtCamp/godam-core#733

* Fix WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound

* Revamp Video Popup setting into global settings

- Add tabs and animation for buttons and modal
- Sanitize keys and save defaults

* Add SCSS nesting and fix minor CSS

* Fix minor CSS

* Revamp GoDAM Product Gallery

- Convert sidebar and floating tile into templates for global use
- Revamp Product Gallery Sidebar & Floating tile UI as per figma
- Add Price settings for video popup modal
- Add hero section of product for sidebar and fix CSS for floating tile
- Add toggle dropdown for products in multiple view and product info in single view
- Style each componenet and fix default values
- Enqueue Video Popup modal's Global CSS variables throughout the site

Refs rtCamp/godam-core#733

* Added block settings for godam prduct gallery block

* Fixed wrapper closing issue

* Filter the logic for video showing on block render

* fix: add horizontal padding to godam carousel track

* Fixed video loading query

* style(godam-product-gallery): convert carousel padding from px to rem

* Move Product Gallery REST into WooCommerce module

* Fixed phpcs issue

* Revamp GoDAM Woo Gloabl Video Popup:

- Add global classes to Sidebar and Floating tile markup
- Change CSS classes from product-gallery to global classes
- Give a fixed color to Swipe ovelay
- Enable AutoPlaying videos when video modal gets opened
- Fix swipe/scroll animation at the end of the video in Swipe overlay
- Fix width of landscape videos in mobile view
- Fix disappearing control bar visibility on hover
- Create new modules for global video Popup
- Register escape manager to close modal
- Register a separate sidebar and video modal module for loading the video and sidebar globally
- Register silder, utility and swiper modules to support the global video popup
- Remove unnecessary codes from previous modules and add them to new global modules
- Localize WooCommerce Godam Vars locally
- Render the featured video modal using the global popup
- Enqueue teh global vars script for WooCommerce Integration
- Update the README file with new template skeleton

Refs rtCamp/godam-core#733

* Change godamVar name to godamWooVars for WooCommerce

* Fix PHPCS Issues

* Fix line-height issue for godam-small-cart-icon

* Move woo sidebar css and poppup css to Woo integration folder

* Update order by description text

* Added reel pops for shortcode, block and metabox

* Fixed reelpops animation issues

* Add mute/play controls and multi-video selection

* Reel Pops: improve controls & modal handling

* Add modal navigation for Reel Pops

* Add enableModalNavigation option for Reel Pops

* fix: resolve layout and alignment issues in product-hotspot-box UI

* Simplify reel-pops videos to ID array

* Add hidden modal nav sources for Reel Pops

* Add mobile popup width for Reel Pops and clean logs

* Fixed phpcs issues

* Removed unnecessary files

* Fixed few bot warnings

* Added play button gloabl settings and rendered on frontend

* Removed unnecessary parsed data

* ReVamp Product Page Reels:

- Refactor UI for Product Page Reels Modal
- Add MiniCart and close button and style them
- Enqueue WooCommerce specific skin for the reels
- Replace preset CSS with Video Modal Gloabl defaults
- Create Product Floating tile for Reels Modal
- Replace aspect ration handler with global video modal classes
- Replace sidebar toggle handler with global video modal classes
- Register escpe handler and sidebar handles for product page reels
- Create Add to cart hnadler and handle all type of products in it
- Fix loop not woking issue on 1-3 product videos
- Create full screen button on teh video modal and style it
- Add animation to full screen button and handle its visibility
- Create handler for loding global video modal on full screen click
- Integrate swipe/scroll control on product page reels full screnn handler
- Handle Modal responsivness and open full screen handler on mobiles
- Create handler for closing both modal's view
- Render global video modal in PHP and fix context keyword
- Change name for Product Gallery rest api file

Refs rtCamp/godam-core#736

* Change default value for Carousel Video PLay Button

* Add check for is product or not on product page reels

* Improve Reel Pops block thumbnails & registration

* Revamp WooCommerce Hotspot Layer:

- Remove shop button and add icons for Add to Cart button
- Refactor conditions for showing icons in editor and frontend
- Fix UI CSS for Product Hotspot Box

Refs rtCamp/godam-core#735

* Refactor reel-pops editor styles & fix modal nav

* - Remove Layers from WooCommerce related features
- Stop rotation of video modal in mobiles and tables

Refs rtCamp/godam-core#733

* Refactor reel-pops view js with new video modal api

* Revamp WooCommerce Layer UI:

- Enable link hover on title and image
- Remove unnecessary code

* Enqueue GODAM player frontend assets

* Add check for godam_context so it dosen't throw warnings

* Sync Reel Pops with global product modals

* Fix PHPCS Errors

* Resolve variable undefined warnings

* Add drag handle and polish reel-pops styles

* Resolve merge conflicts and enqueue reels skin CSS on featured gallery

* Merge branch 'develop' into feat/godam-woocommerce-integration

* Resolve WordPressVIPMinimum.Functions.RestrictedFunctions.switch_to_blog_switch_to_blog

* Make GoDAM Product Gallery and GoDAM Reel Pops blocks premium (#1700)

Co-authored-by: KMchaudhary <kuldipkumar.chaudhary@rtcamp.com>

* Split WooCommerce features into free and premium (#1702)

* Split WooCommerce features into free and premium

- Add PRO tags on premium features
- Disable all save and video section buttoons from settings when API is invalid
- Add Notices for Upgrading plans for users on PRO features
- Configure CSS for premium features in Product edit page
- Add dummy video cards for Product reels
- Disable JS clicks and save_post hooks if key is not valid
- Stop the rendering of premium features on frontend when key is not valid

Refs Refs rtCamp/godam-core#900

* Correct out spelling errors in variables

* Minor changes:

- Fix the godam woo premium plan wordings
- Add CSS for premium plan wordings
- Escape title and use diabled function on buttons

---------

Co-authored-by: Rudrakshi Gupta <rudrakshigupta@Rudrakshis-MacBook-Air.local>

* Add SVG icons for GoDAM Product Gallery and Reel Pops blocks (#1705)

Co-authored-by: KMchaudhary <kuldipkumar.chaudhary@rtcamp.com>

* Chore: fix woo branch merge conflicts (#1707)

* feat: Convert SEO to Premium Feature (#1694)

* feat: Convert SEO to Premium Feature

* fix: Address copilot comments

* Fix: Premium Layers QA Issues (#1699)

* fix: Add message about settings in notice

* fix: Hover issue on cross of welcome walkthrough

* fix: API Key valid cache issue

* fix: Global ads should be disabled for free user if enabled before

* fix: Make different sections in Player Appearance settings in video editor

* fix: Remove extra notice for each form layer

* fix: Pro badge inconsistency in Player Appearance settings

* fix: Address copilot comments

* Fix PHPCS issues

---------

Co-authored-by: Subodh Rajpopat <subodh.rajpopat@rtcamp.com>
Co-authored-by: Rudrakshi Gupta <rudrakshigupta@Rudrakshis-MacBook-Air.local>

* Make Featured Video Gallery permium

- Add blurred thumbnail wrapper for existing videos on the meta box
- Lock the videos and their actions if key is not valid
- Add lock svg and style it
- Add js scripts for not showing the videos on upload
- Configure notice message for the activation on click and upload
- Stop rendering of gallery videos in frontend

Refs rtCamp/godam-core#900

* Minor changes:

- Add loading animation on thumbnail for featured video gallery
- Fix CSS for thumb wrapper in the admin
- Add Spinner CSS for godam-thumb-loading
- Standarize the api key localized variable

Ref rtCamp/godam-core#934

* Fix Timestamped Video Modal

- Fix orientation CSS
- Append video modal on body instead of dropdown

Refs rtCamp/godam-core#733

* Move GoDAM reel pops extra settings under advance settings section (#1741)

Move the inline CSS from PHP file to godam-reel-pops-metabox.scss file

Co-authored-by: KMchaudhary <kuldipkumar.chaudhary@rtcamp.com>

* Fix - Woo UX (Product Hotspot and Integrations Settings) (#1756)

* fix: UX in Woo Product Hotspot

* fix: Remove all CSS-related Integrations Settings

* fix: Address copilot comments

* enhance: Improve Product Hotspot selection UI with images

* Add Mini Cart Functionality on Full Screen GoDAM Player

- fix: handle Woo mini cart interaction in fullscreen safely
- fix: resolve iOS fullscreen limitations with graceful fallback
- feat: add “Return to Fullscreen” UX flow
- fix: prevent fullscreen API errors and React DOM conflicts
- refactor: clean fullscreen exit/entry handling logic
- improve: cross-device compatibility (desktop, Android, iOS)

Refs rtCamp/godam-core#958

* Revamp/woo product edit page (#1755)

* Remove the add product action from product reels page

* Add help tip with preview image for Reel Pops metabox on product edit page

* Refactor GoDAM Reel Pops block settings by removing unused attributes and simplifying configuration

* Resolve copilot comments

* Fix PR feedback

* Update product video gallery layout for responsiveness and adjust button dimensions

---------

Co-authored-by: KMchaudhary <kuldipkumar.chaudhary@rtcamp.com>

* Revamp the godam video product gallery block (#1765)

* feat(woocommerce): Add Video Product Gallery block with child items

Introduce a new Gutenberg block for creating customizable video product
galleries in WooCommerce. The gallery supports carousel and grid layouts with configurable aspect ratios.

* Implement the POC of GoDAM Product Video Gallery block frontend

* Add autoplay and add to cart button settings support

* Move the gallery item gaps from setting panel to style panel

* Improve the gallery item product selection UI by making it responsive, and add the replace/remove product UI

* Fix the add-to-cart button behaviour for normal and variable products, improve the product infor UI

* Add GoDAM Video Product Gallery block enhancements and new skin support

- Introduced a new video player skin (reels-v2) with updated styles.
- Added custom video controls for WooCommerce product gallery videos.
- Updated block.json to include the new skin stylesheet.
- Refactored render.php to utilize the new video player and improved error logging.
- Removed deprecated video player functionality from view.js.
- Registered new styles in the WC_Product_Video_Gallery class.

* Fix the video thumbnail object fit and other style that is being override by godam-player-default-player style

* Add default video preview duration to 5sec, if autoplay is true

This will only auto few intial chunks of video and help improve the bandwidth and performance

* Hide video player controls, from list or grid view

* Add modal functionality to video product gallery with navigation and close controls

* Update modal overlay styles and adjust positioning for WP Admin Bar

* Remove ads layer from WooCommerce videos

* Add AJAX support for product sidebar in video gallery modal

* Add godam reel skin v2

* Refactor video gallery integration: remove unused WooCommerce reel controls, enhance modal keyboard navigation, and update asset paths.

* Add autoplay functionality for visible videos in the gallery and optimize modal video handling

* Resolve PR feedback

---------

Co-authored-by: KMchaudhary <kuldipkumar.chaudhary@rtcamp.com>

* Feat: Custom icon support on WooCommerce Layer (#1771)

* Add custom icon support on WooCommerce Layer

- Add custom icon support for frontend, video editor, and side panel
- Improve icon rendering consistency across components

Refs rtCamp/godam-core#735

* Revert width and height of custom icon

---------

Co-authored-by: Rudrakshi Gupta <rudrakshigupta@Rudrakshis-MacBook-Air.local>

* Feat/godam video product gallery query loop (#1768)

* Enhance video product gallery block with query mode and category filtering

- Added support for 'query' mode in the video product gallery block.
- Implemented category selection for filtering products in the gallery.
- Introduced new REST API endpoints to fetch products based on selected categories.
- Updated styles for better layout and responsiveness in query mode.
- Added video count limit option for query mode

* Add the product gallery icon in new block

* Removed old godam product gallery block

* Add product search input ref and focus handling in video product gallery block

* Enhance styling for video product gallery product sidebar

* Enhance video product gallery videos aspect-ratio, and mobile device responsiveness

Most important change

* Enhance mobile navigation for video product gallery with swipe and wheel support

* Fix the godam player placeholder thumbnail, for godam-reels-v2-skin

* Resolve merge conflicts

* Make GoDAM Video Product gallery block premium

Allow block if valid API KEY exist

* Hide product details on larger screens in product video

* Fix the the PR feedback

* Add video preview on hover feature on godam gallery item

Show the play icon at top left conert to give sence of video element

* Refactor item width handling in GoDAM Video Product Gallery block to use size options

Replace width option with three presets (small, medium, large)

---------

Co-authored-by: KMchaudhary <kuldipkumar.chaudhary@rtcamp.com>

* Feat: Multiple product support query loop (#1776)

* Enhance video product gallery block with query mode and category filtering

- Added support for 'query' mode in the video product gallery block.
- Implemented category selection for filtering products in the gallery.
- Introduced new REST API endpoints to fetch products based on selected categories.
- Updated styles for better layout and responsiveness in query mode.
- Added video count limit option for query mode

* Add the product gallery icon in new block

* Removed old godam product gallery block

* Add product search input ref and focus handling in video product gallery block

* Enhance styling for video product gallery product sidebar

* Enhance video product gallery videos aspect-ratio, and mobile device responsiveness

Most important change

* Enhance mobile navigation for video product gallery with swipe and wheel support

* Fix the godam player placeholder thumbnail, for godam-reels-v2-skin

* Resolve merge conflicts

* Make GoDAM Video Product gallery block premium

Allow block if valid API KEY exist

* Add Multiple Product Support on Query loop

- Add Dropdown for multiple products attached to video
- Add Product dropdown and add to cart buttons
- Style the dropdown and fix issues

Refs Refs rtCamp/godam-core#957

* Replace function Add to Cart with Dispatch solution for smooth functioning

* Remove Border radius from add to cart buttons

* Minor Changes:

- fix: normalize global outside-click handling for dropdowns
- remove: duplicate document click listeners per gallery instance
- improve: use shared instance registry for dropdown state management
- optimize: prevent redundant handler executions on multiple galleries
- enhance: ensure dropdowns close only on outside clicks
- add: animation on cat-spinner

* Update viewScript in video product gallery block to include wc-blocks-data-store

---------

Co-authored-by: KMchaudhary <kuldipkumar.chaudhary@rtcamp.com>
Co-authored-by: Rudrakshi Gupta <rudrakshigupta@Rudrakshis-MacBook-Air.local>

* Add support for videos in WooCommerce product gallery:

- integrate godam_video shortcode in gallery slides
- replicate woo gallery attributes for video compatibility
- add data attributes for video identification
- implement thumbnail alt extraction with fallback logic
- patch WooCommerce lightbox to support video slides
- fix broken video rendering in product gallery
- add styles for the product gallery

* replace engagements param with godam_context and add bg color support

Remove  query param; pass  directly to the
  godam_video shortcode as-is
- Add  query param that sets --godam-video-bg-color CSS variable on the
  .godam-video-embed wrapper; consumed by .video-js in godam-video-embed.scss
  (falls back to #000)
- Remove CommentBox/engagement modal rendering in godam-video-embed.js
- - Fix .godam-video-embed layout: use 100dvh for figure/container height,
  remove hardcoded background-color from wrapper

* Remove: Reel pops block and product metabox support

* fix: ensure WooCommerce cart store availability before adding items to cart (#1733)

* fix: ensure WooCommerce cart store availability before adding items to cart

* fix: Add to cart seamless UX in Video without redirection

* fix: Address copilot comments

---------

Co-authored-by: KMchaudhary <kuldipkumar.chaudhary@rtcamp.com>
Co-authored-by: Subodh Rajpopat <subodh.rajpopat@rtcamp.com>

* Revamp/video product gallery autoplay (#1789)

* Revamp the product gallery block's autoplay behavior

- Add 'Show Play Button' block setting to toggle play icon overlay on idle videos
- Hide play icon automatically on the actively autoplaying item via CSS class
- Fix first video not autoplaying when autoplay is enabled
- Fix 'media could not be loaded' error caused by improper native video.load() call
- Prevent videos from fetching network data (HLS/DASH segments) when off-screen

* Fix the autoplay hover behaviour for autoplay false

* Fix: mute video autoplay in product gallery

* Fix: enable play button visibility in product gallery and add global resize event listener

* Fix: update autoplay behavior for carousel layout in video product gallery

* Fix: conditionally render play icon in video product gallery based on showPlayButton state

* Fix: enhance video product gallery placeholder and play icon styles

* Fix: add showPlayButton context to video product gallery and edit component

* Fix: refine autoplay behavior for grid and carousel layouts in video product gallery

---------

Co-authored-by: KMchaudhary <kuldipkumar.chaudhary@rtcamp.com>

* Minor Changes:

- fix: correctly scope mini cart to each player to prevent cross-instance DOM movement
- feat: monitor Woo drawer state and auto-remove fullscreen return CTA on close

* Remove query mode support from Video Product Gallery block (#1795)

* Remove query mode support from Video Product Gallery block

- Remove count, categories, and products attributes from block.json
- Remove query-related state, effects, preview rendering, and inspector
  panels (Source toggle, Query Settings) from edit.js
- Simplify render.php by removing query helper functions
  (godam_vpg_get_query_limit, godam_vpg_get_matching_product_ids) and
  query branch in godam_vpg_build_gallery_items
- Remove /videos REST endpoint and get_videos_by_products method from
  Product_Gallery_Rest
- Remove query mode editor styles from editor.scss
- Retain mode attribute with default handpicked for future extensibility

* Resolve copilot comments

---------

Co-authored-by: KMchaudhary <kuldipkumar.chaudhary@rtcamp.com>

* Revamp/godam product reels (#1775)

* Revamp the product reels feature by removing all the unwanted video iteraction

Make the product reels autoplay by default, with zero interaction on video

* Add the the product reels carousel iteractivity

* Remove video carousel functionality and associated styles from WooCommerce integration

* Update asset versioning for product reels and adjust button types in video gallery

* Add woocommerce context to remove GoDAM layers from video

* Enhance product reels feature with sequential autoplay and improved navigation controls

* Resolve copilot feedbacks

* Implement maximum video limit for product reels and resolve copilot feedbacks

* Add warning notice when product reels video limit is reached

* Improve product reels autoplay: skip auto-scroll when next video is already in view and switch playback when active video exits viewport

---------

Co-authored-by: KMchaudhary <kuldipkumar.chaudhary@rtcamp.com>

* Fix Copilot comments

* Fix GoDAM iframe playback in PhotoSwipe

* Fetch video and product details dynamically in gallery item editor (#1796)

Remove videoUrl, videoThumbnail, videoTitle, productName, productPrice,
and productImage from persisted block attributes. Only videoId and
productId are stored now.

Video display data is derived from the core media store via useSelect,
and product details are fetched from the WC Store API on each load.
This ensures the editor always shows up-to-date information without
stale cached values in block markup.

Co-authored-by: KMchaudhary <kuldipkumar.chaudhary@rtcamp.com>

* Add Spinner for Product Hotspot

- Refactor spinner rendering using DOM instead of innerHTML
- Add reusable SVG spinner with improved animation and styling

* Fix/godam tab media selection - WooCommerce (#1731)

* feat: Enhance GoDAM media selection by supporting multi-select and adding virtual attachment handling for product galleries, products reels, and product reel pops meta boxes

* feat: Add virtual attachment handling for GoDAM videos in Reel Pops block

* fix: Enhance virtual attachment handling in GoDAM Reel Pops block to prevent cross-block interference

* fix: Prevent default media selection logic for GoDAM virtual attachments in video and gallery frames

* fix: Refactor media selection logic to use apiFetch for creating virtual attachments and handle errors gracefully

* fix: Apply feedback

* Revert "fix: Apply feedback"

This reverts commit 89b37e4.

---------

Co-authored-by: KMchaudhary <kuldipkumar.chaudhary@rtcamp.com>
Co-authored-by: Subodh Rajpopat <subodh.rajpopat@rtcamp.com>

* Fix CSS reference for video product gallery block (#1800)

Co-authored-by: KMchaudhary <kuldipkumar.chaudhary@rtcamp.com>

* fix: Spacing

* fix: Premium Woo Layer functions

* Remove Dead code

* fix: Remove godam-product-gallery webpack import

* fix: Address copilot woo feedback (#1803)

* fix: Address copilot woo feedback

* fix: Remove dead code

* fix: Remove dead code

---------

Co-authored-by: Rudrakshi Gupta <rudrakshigupta@Rudrakshis-MacBook-Air.local>
Co-authored-by: vinit khollam <khollam.vinit@gmail.com>
Co-authored-by: vineet khollam <53342781+vk17-starlord@users.noreply.github.com>
Co-authored-by: opurockey <opu.rockey@gmail.com>
Co-authored-by: Sabbir Ahmed <sabbir.081070@gmail.com>
Co-authored-by: Kuldip Chaudhary <64731232+KMchaudhary@users.noreply.github.com>
Co-authored-by: KMchaudhary <kuldipkumar.chaudhary@rtcamp.com>
Co-authored-by: Subodh Rajpopat <subodh.rajpopat@rtcamp.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

Copilot code review Copilot Copilot left review comments

@rudrakshi-gupta rudrakshi-gupta rudrakshi-gupta approved these changes

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

4 participants

@KMchaudhary @subodhr258 @rudrakshi-gupta