feat: add new code block svg file in icons folder

[mukulpadwal]

What does it do?

This PR adds a new "Code block" icon to the icon library used in Strapi. The new icon will allow for clearer differentiation between "Code block" and inline "Code" text modifiers.

Why is it needed?

The addition of this icon addresses user feedback indicating confusion between code blocks and inline code. Having a dedicated "Code block" icon will improve the user experience by making it easier to identify the block element, which is distinct from an inline modifier, and aligns with design consistency.

How to test it?

1. Storybook Verification : Check the Storybook instance for the icon library. The CodeBlock icon should be visible along with other icons, as shown in the screenshot.

2. Visual Inspection : Ensure the CodeBlock icon matches the intended design and is distinguishable from the Code icon.

Related issue(s)/PR(s)

This PR closes issue #1804 by introducing the "Code block" icon from the Phosphor library and adding it to the design system as part of the icon update process in Strapi 5.

[changeset-bot]

🦋 Changeset detected

Latest commit: 1ca7b1d

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 3 packages

Name	Type
@strapi/icons	Minor
@strapi/design-system	Minor
@strapi/ui-primitives	Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
design-system	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Nov 5, 2024 11:35am

[hanpaine]

Thanks for the contribution @mukulpadwal 🚀 @lucasboilly please may you take a look at this? 🙏

[lucasboilly]

Hey @hanpaine and hey @mukulpadwal, thanks a lot! I's all good, but I don't think it will automatically fix #22058. I think we'll need to specify that that the code block should use the "CodeBlock" icon. It would require a new PR on the CMS side and I guess it's here (line 98), hope it helps!

[mukulpadwal]

Hey @lucasboilly, @hanpaine, @remidej

Yes, you’re correct! We should be able to use the CodeBlock icon once it’s merged into the Strapi Design System repo. Only then can we access it to resolve the Strapi issue.
Also, I realized I mistakenly linked this with the main issue earlier—apologies for the confusion!

Do you think it would be best to close this PR and create a new one that addresses only the design system issue?
Then, once that’s merged, we can work on the main Strapi issue with the updated CodeBlock icon.

[remidej]

@mukulpadwal thanks for you PR! Just to clarify we need these steps:

1. merge this PR
2. release the DS repo
3. merge a PR that only updates the DS in the CMS repo
4. then we can make the CMS PR to use the new icon in blocks

I can do 1 to 3 then ping you to open the final PR if that works for you

[remidej]

Could you just add a changeset file? (via CLI, see these docs) We need it for our automated releases solution

[mukulpadwal]

Hey @remidej, I’ve added the changeset with a detailed description. Let me know if there's anything else you'd like me to update.

[remidej]

Could you make it a minor instead?

(I'm not sure it actually matters since the tool is in pre-release mode, but I don't want to take any chances)

[mukulpadwal]

Sure on it.

[mukulpadwal]

@remidej changed it from major to minor.