Skip to content

Updating block icons#579

Merged
tibiii merged 3 commits into2.1-trunkfrom
563-updated-block-icons
Aug 6, 2025
Merged

Updating block icons#579
tibiii merged 3 commits into2.1-trunkfrom
563-updated-block-icons

Conversation

@ZaredRogers
Copy link
Copy Markdown
Contributor

@ZaredRogers ZaredRogers commented Aug 5, 2025

Description

Updated block icons for various block variations

Custom SVGs were added to:

  • dress
  • facilities
  • health
  • ends-in
  • departs-from
  • climate
  • transport

Summary by CodeRabbit

  • Style
    • Updated icons for multiple blocks, replacing simple icon strings with custom SVG icons for improved visual detail and consistency.
  • Documentation
    • Added a changelog entry noting the block icon updates for enhanced clarity.

@ZaredRogers ZaredRogers added this to the 2.1.0 milestone Aug 5, 2025
@ZaredRogers ZaredRogers requested a review from tibiii August 5, 2025 10:52
@ZaredRogers ZaredRogers self-assigned this Aug 5, 2025
@github-project-automation github-project-automation bot moved this to Needs Triage in Tour Operator Aug 5, 2025
@coderabbitai
Copy link
Copy Markdown
Contributor

coderabbitai bot commented Aug 5, 2025

Warning

CodeRabbit GitHub Action detected

The repository is using both CodeRabbit Pro and CodeRabbit Open Source (via GitHub Actions), which is not recommended as it may lead to duplicate comments and extra noise. Please remove the CodeRabbit GitHub Action.

Walkthrough

This update revises the icon properties for multiple block variation registrations, replacing existing icon strings with either different icon strings or custom SVG icons. The changes are limited to the visual representation of block icons and do not affect block attributes, logic, or functionality. The changelog is updated to reflect these enhancements.

Changes

Cohort / File(s) Change Summary
Accommodation & Related Blocks Icon Update
build/blocks/accommodation-related-accommodation/index.js, build/blocks/featured-accommodation/index.js, build/blocks/review-related-accommodation/index.js, build/blocks/tour-related-accommodation/index.js, src/blocks/accommodation-related-accommodation/index.js, src/blocks/featured-accommodation/index.js, src/blocks/review-related-accommodation/index.js, src/blocks/tour-related-accommodation/index.js
Updated icon property from "admin-home" to "admin-multisite" for accommodation-related block variations.
SVG Icon Enhancements
build/blocks/climate/index.js, build/blocks/dress/index.js, build/blocks/departs-from/index.js, build/blocks/ends-in/index.js, build/blocks/facilities/index.js, src/blocks/climate/index.js, src/blocks/dress/index.js, src/blocks/departs-from/index.js, src/blocks/ends-in/index.js, src/blocks/facilities/index.js
Replaced string icon properties with custom inline SVG icons using wp.element.createElement.
Destination & Facts Blocks Icon Update
build/blocks/destination-to-accommodation/index.js, build/blocks/facts-country-wrapper/index.js, build/blocks/facts-regions-wrapper/index.js, build/blocks/lsx-destination-to-tour/index.js, src/blocks/destination-to-accommodation/index.js, src/blocks/facts-country-wrapper/index.js, src/blocks/facts-regions-wrapper/index.js, src/blocks/lsx-destination-to-tour/index.js
Changed icon property to different WordPress dashicons (e.g., "admin-site-alt3" to "admin-site", "clipboard" to "admin-site-alt").
Map Blocks Icon Update
build/blocks/google-map/index.js, build/blocks/wetu-map/index.js, src/blocks/google-map/index.js, src/blocks/wetu-map/index.js
Updated map block icon properties to new dashicon values ("location-alt" to "admin-site-alt3", "admin-site-alt" to "admin-site-alt3").
Suggested Visitor Types Icon Update
build/blocks/suggested-visitor-types/index.js, src/blocks/suggested-visitor-types/index.js
Changed icon property from "yes-alt" to "groups".
Changelog Update
changelog.md
Added entry documenting the icon updates for various block variations under version 2.1.0 (in development).

Sequence Diagram(s)

Not applicable: Changes are limited to icon property updates and do not affect control flow or feature logic.

Estimated code review effort

🎯 1 (Trivial) | ⏱️ ~3 minutes

Possibly related PRs

Suggested labels

[Type] Enhancement

Suggested reviewers

  • tibiii

Note

⚡️ Unit Test Generation is now available in beta!

Learn more here, or try it out under "Finishing Touches" below.


📜 Recent review details

Configuration used: .coderabbit.yaml
Review profile: CHILL
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 3cf3af0 and 47e0771.

📒 Files selected for processing (18)
  • build/blocks/climate/index.js (1 hunks)
  • build/blocks/dress/index.js (1 hunks)
  • src/blocks/accommodation-related-accommodation/index.js (1 hunks)
  • src/blocks/climate/index.js (1 hunks)
  • src/blocks/departs-from/index.js (1 hunks)
  • src/blocks/destination-to-accommodation/index.js (1 hunks)
  • src/blocks/dress/index.js (1 hunks)
  • src/blocks/ends-in/index.js (1 hunks)
  • src/blocks/facilities/index.js (1 hunks)
  • src/blocks/facts-country-wrapper/index.js (1 hunks)
  • src/blocks/facts-regions-wrapper/index.js (1 hunks)
  • src/blocks/featured-accommodation/index.js (1 hunks)
  • src/blocks/google-map/index.js (1 hunks)
  • src/blocks/lsx-destination-to-tour/index.js (1 hunks)
  • src/blocks/review-related-accommodation/index.js (1 hunks)
  • src/blocks/suggested-visitor-types/index.js (1 hunks)
  • src/blocks/tour-related-accommodation/index.js (1 hunks)
  • src/blocks/wetu-map/index.js (1 hunks)
✅ Files skipped from review due to trivial changes (17)
  • src/blocks/destination-to-accommodation/index.js
  • src/blocks/accommodation-related-accommodation/index.js
  • src/blocks/lsx-destination-to-tour/index.js
  • src/blocks/review-related-accommodation/index.js
  • src/blocks/facts-country-wrapper/index.js
  • src/blocks/facts-regions-wrapper/index.js
  • src/blocks/climate/index.js
  • src/blocks/suggested-visitor-types/index.js
  • src/blocks/wetu-map/index.js
  • src/blocks/google-map/index.js
  • src/blocks/tour-related-accommodation/index.js
  • src/blocks/departs-from/index.js
  • build/blocks/climate/index.js
  • src/blocks/featured-accommodation/index.js
  • src/blocks/facilities/index.js
  • src/blocks/ends-in/index.js
  • src/blocks/dress/index.js
🚧 Files skipped from review as they are similar to previous changes (1)
  • build/blocks/dress/index.js
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)
  • GitHub Check: review
  • GitHub Check: Summary
✨ Finishing Touches
  • 📝 Generate Docstrings
🧪 Generate unit tests
  • Create PR with unit tests
  • Post copyable unit tests in a comment
  • Commit unit tests in branch 563-updated-block-icons

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share
🪧 Tips

Chat

There are 3 ways to chat with CodeRabbit:

  • Review comments: Directly reply to a review comment made by CodeRabbit. Example:
    • I pushed a fix in commit <commit_id>, please review it.
    • Explain this complex logic.
    • Open a follow-up GitHub issue for this discussion.
  • Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query. Examples:
    • @coderabbitai explain this code block.
  • PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
    • @coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.
    • @coderabbitai read src/utils.ts and explain its main purpose.
    • @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.

Support

Need help? Create a ticket on our support page for assistance with any issues or questions.

CodeRabbit Commands (Invoked using PR comments)

  • @coderabbitai pause to pause the reviews on a PR.
  • @coderabbitai resume to resume the paused reviews.
  • @coderabbitai review to trigger an incremental review. This is useful when automatic reviews are disabled for the repository.
  • @coderabbitai full review to do a full review from scratch and review all the files again.
  • @coderabbitai summary to regenerate the summary of the PR.
  • @coderabbitai generate docstrings to generate docstrings for this PR.
  • @coderabbitai generate sequence diagram to generate a sequence diagram of the changes in this PR.
  • @coderabbitai generate unit tests to generate unit tests for this PR.
  • @coderabbitai resolve resolve all the CodeRabbit review comments.
  • @coderabbitai configuration to show the current CodeRabbit configuration for the repository.
  • @coderabbitai help to get help.

Other keywords and placeholders

  • Add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.
  • Add @coderabbitai summary to generate the high-level summary at a specific location in the PR description.
  • Add @coderabbitai anywhere in the PR title to generate the title automatically.

Documentation and Community

  • Visit our Documentation for detailed information on how to use CodeRabbit.
  • Join our Discord Community to get help, request features, and share feedback.
  • Follow us on X/Twitter for updates and announcements.

@github-actions
Copy link
Copy Markdown

github-actions bot commented Aug 5, 2025

Image description CodeRabbit


Uplevel your code reviews with CodeRabbit Pro

CodeRabbit Pro

If you like this project, please support us by purchasing the Pro version. The Pro version has advanced context, superior noise reduction and several proprietary improvements compared to the open source version. Moreover, CodeRabbit Pro is free for open source projects.

Copy link
Copy Markdown

@github-actions github-actions bot left a comment

Choose a reason for hiding this comment

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

Image description CodeRabbit

Commits Files that changed from the base of the PR and between 8130784 and 3cf3af0 commits.
Files selected (1)
  • changelog.md (1)
Files not summarized due to errors (1)
  • changelog.md (nothing obtained from openai)
Files not reviewed due to errors (1)
  • changelog.md (no response)
Review comments generated (0)
  • Review: 0
  • LGTM: 0

Tips

Chat with Image description CodeRabbit Bot (@coderabbitai)

  • Reply on review comments left by this bot to ask follow-up questions. A review comment is a comment on a diff or a file.
  • Invite the bot into a review comment chain by tagging @coderabbitai in a reply.

Code suggestions

  • The bot may make code suggestions, but please review them carefully before committing since the line number ranges may be misaligned.
  • You can edit the comment made by the bot and manually tweak the suggestion if it is slightly off.

Pausing incremental reviews

  • Add @coderabbitai: ignore anywhere in the PR description to pause further reviews from the bot.

Copy link
Copy Markdown
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

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

Actionable comments posted: 3

♻️ Duplicate comments (2)
build/blocks/facilities/index.js (1)

5-6: Colour token issue repeated

fill: "#currentColor" is invalid. Drop the # as per the earlier comment.

build/blocks/departs-from/index.js (1)

5-6: Colour token issue repeated

Update to fill: "currentColor" for correctness and consistency.

🧹 Nitpick comments (7)
build/blocks/suggested-visitor-types/index.js (1)

1-1: Icon swap is fine – verify source synchronisation

The switch to "groups" is harmless, yet keep in mind the build-artefact caveat.
Confirm the source file reflects the same change.

build/blocks/tour-related-accommodation/index.js (1)

1-1: admin-homeadmin-multisite change looks good, but avoid editing compiled code

To prevent accidental regression, propagate this icon update to the original source block registration and re-build.

build/blocks/featured-accommodation/index.js (1)

1-1: Apply icon change in source file

Same concern as above: committing built output makes code reviews harder and risks merge conflicts. Move the icon:"admin-multisite" change to the un-minified source and rebuild.

build/blocks/facts-regions-wrapper/index.js (1)

1-1: Avoid hand-editing compiled JS

Please propagate the icon:"admin-site-alt" update to the original block-variation registration script rather than the build directory. It keeps the repository history clean and prevents accidental loss of changes.

build/blocks/accommodation-related-accommodation/index.js (1)

1-1: Move change out of build artefact

The switch to icon:"admin-multisite" looks good, yet placing it in the built file is fragile. Please edit the source file and let the build pipeline regenerate build/…/index.js.

build/blocks/review-related-accommodation/index.js (1)

1-1: Same build-directory caveat

For consistency and ease of maintenance, update the icon slug in the source variation registration and rebuild instead of committing changes to build/blocks/review-related-accommodation/index.js.

build/blocks/ends-in/index.js (1)

1-8: Consider code formatting for better maintainability.

The entire block registration is on a single line, making it difficult to read and maintain. While this is likely a build output, consider using prettier formatting in the source files.

For better readability, the source file should be formatted like:

wp.domReady(() => {
  wp.blocks.registerBlockVariation("core/group", {
    name: "lsx-tour-operator/ends-in",
    title: "Ends In",
    icon: wp.element.createElement(
      "svg",
      { 
        xmlns: "http://www.w3.org/2000/svg", 
        width: 20, 
        height: 20, 
        viewBox: "0 0 20 20", 
        fill: "none" 
      },
      wp.element.createElement("path", {
        d: "M13.0813 8.03477L9.30937 2.11602...",
        fill: "#currentColor"
      })
    ),
    // ... rest of properties
  });
});
📜 Review details

Configuration used: .coderabbit.yaml
Review profile: CHILL
Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 8130784 and 3cf3af0.

📒 Files selected for processing (17)
  • build/blocks/accommodation-related-accommodation/index.js (1 hunks)
  • build/blocks/climate/index.js (1 hunks)
  • build/blocks/departs-from/index.js (1 hunks)
  • build/blocks/destination-to-accommodation/index.js (1 hunks)
  • build/blocks/dress/index.js (1 hunks)
  • build/blocks/ends-in/index.js (1 hunks)
  • build/blocks/facilities/index.js (1 hunks)
  • build/blocks/facts-country-wrapper/index.js (1 hunks)
  • build/blocks/facts-regions-wrapper/index.js (1 hunks)
  • build/blocks/featured-accommodation/index.js (1 hunks)
  • build/blocks/google-map/index.js (1 hunks)
  • build/blocks/lsx-destination-to-tour/index.js (1 hunks)
  • build/blocks/review-related-accommodation/index.js (1 hunks)
  • build/blocks/suggested-visitor-types/index.js (1 hunks)
  • build/blocks/tour-related-accommodation/index.js (1 hunks)
  • build/blocks/wetu-map/index.js (1 hunks)
  • changelog.md (1 hunks)
🧰 Additional context used
📓 Path-based instructions (1)
**/*.{php,js,ts,jsx,tsx}

⚙️ CodeRabbit Configuration File

**/*.{php,js,ts,jsx,tsx}: - Follow WordPress coding standards.

  • Escape output and sanitize input.
  • Follow plugin security best practices.
  • Enforce prefixing for all functions, classes, and constants to avoid naming collisions.
  • Check for accessibility best practices in UI code (labels, ARIA attributes, color contrast).
  • Ensure inline documentation/comments for all custom functions and classes.
  • Ensure consistent formatting and schema validation.
  • Keep documentation up to date and clear.
  • On Pull Requests check for updates to the changelog file.

Files:

  • build/blocks/facilities/index.js
  • build/blocks/suggested-visitor-types/index.js
  • build/blocks/facts-country-wrapper/index.js
  • build/blocks/google-map/index.js
  • build/blocks/review-related-accommodation/index.js
  • build/blocks/wetu-map/index.js
  • build/blocks/destination-to-accommodation/index.js
  • build/blocks/accommodation-related-accommodation/index.js
  • build/blocks/tour-related-accommodation/index.js
  • build/blocks/dress/index.js
  • build/blocks/lsx-destination-to-tour/index.js
  • build/blocks/ends-in/index.js
  • build/blocks/climate/index.js
  • build/blocks/facts-regions-wrapper/index.js
  • build/blocks/departs-from/index.js
  • build/blocks/featured-accommodation/index.js
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)
  • GitHub Check: Summary
🔇 Additional comments (8)
build/blocks/destination-to-accommodation/index.js (1)

1-1: Edit appears in transpiled build artefact – please ensure the real source is updated as well

The change is correct, but this file lives under build/…, which is normally re-generated from the source on every build.
If the matching source file (often src/blocks/destination-to-accommodation/index.js or similar) is not carrying the same icon update, the next build will overwrite this change and the new icon will be lost.

Please verify that the update was made in the canonical source before merging.

build/blocks/facts-country-wrapper/index.js (1)

1-1: Confirm update in canonical source before merging

Same concern as above – this edit is in a compiled file.
Double-check the corresponding source so the icon change survives future builds.

build/blocks/google-map/index.js (1)

1-1: Google-map block: build file edited directly

Looks good functionally, but please make sure the source variant of this block also now uses "admin-site-alt3". Otherwise the change will disappear on the next npm run build.

build/blocks/wetu-map/index.js (1)

1-1: Empty alt text – confirm intent

The inner core/image block still carries alt:"". If the image is decorative this is correct; if it conveys information – even in the editor – supply descriptive alt text for accessibility.

build/blocks/facts-regions-wrapper/index.js (1)

1-1: Decorative image alt attribute

alt:"" is acceptable for purely decorative icons, but double-check that the region pin graphic does not convey meaning that screen-reader users would miss.

build/blocks/lsx-destination-to-tour/index.js (1)

1-1: Icon slug change looks good

The replacement of the Dashicon slug from location-alt to admin-site causes no functional side-effects. No further action required.

build/blocks/ends-in/index.js (1)

1-8: Proper SVG icon implementation with good accessibility practices.

The custom SVG icon implementation is correct and follows WordPress standards:

  • Proper use of wp.element.createElement for JSX-like syntax
  • SVG attributes are correctly set with appropriate dimensions (20x20)
  • Using currentColor for fill ensures proper theming support
  • ViewBox is properly defined for scalability
changelog.md (1)

13-13: Accurate and well-formatted changelog entry.

The changelog entry properly documents the block icon updates:

  • Correctly lists all blocks that received custom SVG icons
  • Follows the established changelog formatting
  • Includes the proper PR reference
  • Placed in appropriate "Enhancements" section

Copy link
Copy Markdown

@github-actions github-actions bot left a comment

Choose a reason for hiding this comment

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

Image description CodeRabbit

Commits Files that changed from the base of the PR and between 3cf3af0 and 47e0771 commits.
Files selected (16)
  • src/blocks/accommodation-related-accommodation/index.js (1)
  • src/blocks/climate/index.js (1)
  • src/blocks/departs-from/index.js (1)
  • src/blocks/destination-to-accommodation/index.js (1)
  • src/blocks/dress/index.js (1)
  • src/blocks/ends-in/index.js (1)
  • src/blocks/facilities/index.js (1)
  • src/blocks/facts-country-wrapper/index.js (1)
  • src/blocks/facts-regions-wrapper/index.js (1)
  • src/blocks/featured-accommodation/index.js (1)
  • src/blocks/google-map/index.js (1)
  • src/blocks/lsx-destination-to-tour/index.js (1)
  • src/blocks/review-related-accommodation/index.js (1)
  • src/blocks/suggested-visitor-types/index.js (1)
  • src/blocks/tour-related-accommodation/index.js (1)
  • src/blocks/wetu-map/index.js (1)
Files not summarized due to errors (16)
  • src/blocks/destination-to-accommodation/index.js (nothing obtained from openai)
  • src/blocks/ends-in/index.js (nothing obtained from openai)
  • src/blocks/departs-from/index.js (nothing obtained from openai)
  • src/blocks/climate/index.js (nothing obtained from openai)
  • src/blocks/accommodation-related-accommodation/index.js (nothing obtained from openai)
  • src/blocks/dress/index.js (nothing obtained from openai)
  • src/blocks/facts-regions-wrapper/index.js (nothing obtained from openai)
  • src/blocks/facts-country-wrapper/index.js (nothing obtained from openai)
  • src/blocks/google-map/index.js (nothing obtained from openai)
  • src/blocks/featured-accommodation/index.js (nothing obtained from openai)
  • src/blocks/facilities/index.js (nothing obtained from openai)
  • src/blocks/lsx-destination-to-tour/index.js (nothing obtained from openai)
  • src/blocks/review-related-accommodation/index.js (nothing obtained from openai)
  • src/blocks/suggested-visitor-types/index.js (nothing obtained from openai)
  • src/blocks/tour-related-accommodation/index.js (nothing obtained from openai)
  • src/blocks/wetu-map/index.js (nothing obtained from openai)
Files not reviewed due to errors (16)
  • src/blocks/departs-from/index.js (no response)
  • src/blocks/accommodation-related-accommodation/index.js (no response)
  • src/blocks/dress/index.js (no response)
  • src/blocks/destination-to-accommodation/index.js (no response)
  • src/blocks/ends-in/index.js (no response)
  • src/blocks/climate/index.js (no response)
  • src/blocks/facts-regions-wrapper/index.js (no response)
  • src/blocks/facts-country-wrapper/index.js (no response)
  • src/blocks/google-map/index.js (no response)
  • src/blocks/featured-accommodation/index.js (no response)
  • src/blocks/lsx-destination-to-tour/index.js (no response)
  • src/blocks/facilities/index.js (no response)
  • src/blocks/suggested-visitor-types/index.js (no response)
  • src/blocks/review-related-accommodation/index.js (no response)
  • src/blocks/tour-related-accommodation/index.js (no response)
  • src/blocks/wetu-map/index.js (no response)
Review comments generated (0)
  • Review: 0
  • LGTM: 0

Tips

Chat with Image description CodeRabbit Bot (@coderabbitai)

  • Reply on review comments left by this bot to ask follow-up questions. A review comment is a comment on a diff or a file.
  • Invite the bot into a review comment chain by tagging @coderabbitai in a reply.

Code suggestions

  • The bot may make code suggestions, but please review them carefully before committing since the line number ranges may be misaligned.
  • You can edit the comment made by the bot and manually tweak the suggestion if it is slightly off.

Pausing incremental reviews

  • Add @coderabbitai: ignore anywhere in the PR description to pause further reviews from the bot.

@tibiii tibiii merged commit eb0dd25 into 2.1-trunk Aug 6, 2025
5 of 6 checks passed
@tibiii tibiii deleted the 563-updated-block-icons branch August 6, 2025 07:57
@github-project-automation github-project-automation bot moved this from Needs Triage to ✅ Done in Tour Operator Aug 6, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

Status: ✅ Done

Development

Successfully merging this pull request may close these issues.

2 participants