From 50cbe3947dee8bf940d176c6e27c3db45bc4e9a9 Mon Sep 17 00:00:00 2001 From: Jeremy Herve Date: Mon, 17 Jul 2023 14:37:57 +0200 Subject: [PATCH 1/5] Social Links: add Threads Icon Fixes #52463 --- packages/block-library/src/social-link/icons/index.js | 1 + .../block-library/src/social-link/icons/threads.js | 10 ++++++++++ packages/block-library/src/social-link/index.php | 4 ++++ .../src/social-link/socials-with-bg.scss | 5 +++++ .../src/social-link/socials-without-bg.scss | 4 ++++ packages/block-library/src/social-link/variations.js | 7 +++++++ .../fixtures/blocks/core__social-link-threads.html | 1 + .../fixtures/blocks/core__social-link-threads.json | 11 +++++++++++ .../blocks/core__social-link-threads.parsed.json | 11 +++++++++++ .../blocks/core__social-link-threads.serialized.html | 1 + 10 files changed, 55 insertions(+) create mode 100644 packages/block-library/src/social-link/icons/threads.js create mode 100644 test/integration/fixtures/blocks/core__social-link-threads.html create mode 100644 test/integration/fixtures/blocks/core__social-link-threads.json create mode 100644 test/integration/fixtures/blocks/core__social-link-threads.parsed.json create mode 100644 test/integration/fixtures/blocks/core__social-link-threads.serialized.html diff --git a/packages/block-library/src/social-link/icons/index.js b/packages/block-library/src/social-link/icons/index.js index 80b547c2d1710..62c32d2d5f35c 100644 --- a/packages/block-library/src/social-link/icons/index.js +++ b/packages/block-library/src/social-link/icons/index.js @@ -31,6 +31,7 @@ export * from './snapchat'; export * from './soundcloud'; export * from './spotify'; export * from './telegram'; +export * from './threads'; export * from './tiktok'; export * from './tumblr'; export * from './twitch'; diff --git a/packages/block-library/src/social-link/icons/threads.js b/packages/block-library/src/social-link/icons/threads.js new file mode 100644 index 0000000000000..2eaec823f9d79 --- /dev/null +++ b/packages/block-library/src/social-link/icons/threads.js @@ -0,0 +1,10 @@ +/** + * WordPress dependencies + */ +import { Path, SVG } from '@wordpress/primitives'; + +export const ThreadsIcon = () => ( + + + +); diff --git a/packages/block-library/src/social-link/index.php b/packages/block-library/src/social-link/index.php index 51ed9374c9bcd..de11b23041100 100644 --- a/packages/block-library/src/social-link/index.php +++ b/packages/block-library/src/social-link/index.php @@ -258,6 +258,10 @@ function block_core_social_link_services( $service = '', $field = '' ) { 'name' => 'Telegram', 'icon' => '', ), + 'threads' => array( + 'name' => 'Threads', + 'icon' => '', + ), 'tiktok' => array( 'name' => 'TikTok', 'icon' => '', diff --git a/packages/block-library/src/social-link/socials-with-bg.scss b/packages/block-library/src/social-link/socials-with-bg.scss index 65542dafd9541..bc1dfc60a29de 100644 --- a/packages/block-library/src/social-link/socials-with-bg.scss +++ b/packages/block-library/src/social-link/socials-with-bg.scss @@ -154,6 +154,11 @@ color: #fff; } +.wp-social-link-threads { + background-color: #1c1e21; + color: #fff; +} + .wp-social-link-tiktok { background-color: #000; color: #fff; diff --git a/packages/block-library/src/social-link/socials-without-bg.scss b/packages/block-library/src/social-link/socials-without-bg.scss index 82af8d42ef1b8..7d5b8b12acf83 100644 --- a/packages/block-library/src/social-link/socials-without-bg.scss +++ b/packages/block-library/src/social-link/socials-without-bg.scss @@ -119,6 +119,10 @@ color: #2aabee; } +.wp-social-link-threads { + color: #1c1e21; +} + .wp-social-link-tiktok { color: #000; } diff --git a/packages/block-library/src/social-link/variations.js b/packages/block-library/src/social-link/variations.js index 40aaf3cc9d0f1..47307ca65c088 100644 --- a/packages/block-library/src/social-link/variations.js +++ b/packages/block-library/src/social-link/variations.js @@ -35,6 +35,7 @@ import { SoundCloudIcon, SpotifyIcon, TelegramIcon, + ThreadsIcon, TiktokIcon, TumblrIcon, TwitchIcon, @@ -255,6 +256,12 @@ const variations = [ title: 'Telegram', icon: TelegramIcon, }, + { + name: 'threads', + attributes: { service: 'threads' }, + title: 'Threads', + icon: ThreadsIcon, + }, { name: 'tiktok', attributes: { service: 'tiktok' }, diff --git a/test/integration/fixtures/blocks/core__social-link-threads.html b/test/integration/fixtures/blocks/core__social-link-threads.html new file mode 100644 index 0000000000000..3189c247c825f --- /dev/null +++ b/test/integration/fixtures/blocks/core__social-link-threads.html @@ -0,0 +1 @@ + diff --git a/test/integration/fixtures/blocks/core__social-link-threads.json b/test/integration/fixtures/blocks/core__social-link-threads.json new file mode 100644 index 0000000000000..334725c644181 --- /dev/null +++ b/test/integration/fixtures/blocks/core__social-link-threads.json @@ -0,0 +1,11 @@ +[ + { + "name": "core/social-link", + "isValid": true, + "attributes": { + "url": "https://example.com/", + "service": "threads" + }, + "innerBlocks": [] + } +] diff --git a/test/integration/fixtures/blocks/core__social-link-threads.parsed.json b/test/integration/fixtures/blocks/core__social-link-threads.parsed.json new file mode 100644 index 0000000000000..31274f0ac3e94 --- /dev/null +++ b/test/integration/fixtures/blocks/core__social-link-threads.parsed.json @@ -0,0 +1,11 @@ +[ + { + "blockName": "core/social-link-threads", + "attrs": { + "url": "https://example.com/" + }, + "innerBlocks": [], + "innerHTML": "", + "innerContent": [] + } +] diff --git a/test/integration/fixtures/blocks/core__social-link-threads.serialized.html b/test/integration/fixtures/blocks/core__social-link-threads.serialized.html new file mode 100644 index 0000000000000..cc93afc92ce47 --- /dev/null +++ b/test/integration/fixtures/blocks/core__social-link-threads.serialized.html @@ -0,0 +1 @@ + From b9df8abfa6c96d9c465a2a584be387edb290d1a3 Mon Sep 17 00:00:00 2001 From: Jeremy Herve Date: Mon, 17 Jul 2023 14:48:05 +0200 Subject: [PATCH 2/5] Fix array alignment --- packages/block-library/src/social-link/index.php | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/block-library/src/social-link/index.php b/packages/block-library/src/social-link/index.php index de11b23041100..0a4589cebb096 100644 --- a/packages/block-library/src/social-link/index.php +++ b/packages/block-library/src/social-link/index.php @@ -258,7 +258,7 @@ function block_core_social_link_services( $service = '', $field = '' ) { 'name' => 'Telegram', 'icon' => '', ), - 'threads' => array( + 'threads' => array( 'name' => 'Threads', 'icon' => '', ), From 720e4c5b565f6d1e20e24acff309ea5365c83f3e Mon Sep 17 00:00:00 2001 From: Jeremy Herve Date: Tue, 25 Jul 2023 09:21:01 +0200 Subject: [PATCH 3/5] Update color following feedback --- packages/block-library/src/social-link/socials-with-bg.scss | 2 +- packages/block-library/src/social-link/socials-without-bg.scss | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/block-library/src/social-link/socials-with-bg.scss b/packages/block-library/src/social-link/socials-with-bg.scss index bc1dfc60a29de..042db464f6ee2 100644 --- a/packages/block-library/src/social-link/socials-with-bg.scss +++ b/packages/block-library/src/social-link/socials-with-bg.scss @@ -155,7 +155,7 @@ } .wp-social-link-threads { - background-color: #1c1e21; + background-color: #000; color: #fff; } diff --git a/packages/block-library/src/social-link/socials-without-bg.scss b/packages/block-library/src/social-link/socials-without-bg.scss index 7d5b8b12acf83..ea8fca5d7ab83 100644 --- a/packages/block-library/src/social-link/socials-without-bg.scss +++ b/packages/block-library/src/social-link/socials-without-bg.scss @@ -120,7 +120,7 @@ } .wp-social-link-threads { - color: #1c1e21; + color: #000; } .wp-social-link-tiktok { From 4fb637a469ac677515f60278fd3026acab215515 Mon Sep 17 00:00:00 2001 From: Jeremy Herve Date: Tue, 25 Jul 2023 17:10:54 +0200 Subject: [PATCH 4/5] Update svg See https://github.com/WordPress/gutenberg/pull/52685#issuecomment-1649474750 Co-authored-by: Joen A <1204802+jasmussen@users.noreply.github.com> --- packages/block-library/src/social-link/icons/threads.js | 2 +- packages/block-library/src/social-link/index.php | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/block-library/src/social-link/icons/threads.js b/packages/block-library/src/social-link/icons/threads.js index 2eaec823f9d79..12859743cb703 100644 --- a/packages/block-library/src/social-link/icons/threads.js +++ b/packages/block-library/src/social-link/icons/threads.js @@ -5,6 +5,6 @@ import { Path, SVG } from '@wordpress/primitives'; export const ThreadsIcon = () => ( - + ); diff --git a/packages/block-library/src/social-link/index.php b/packages/block-library/src/social-link/index.php index 0a4589cebb096..2b3d339fc93aa 100644 --- a/packages/block-library/src/social-link/index.php +++ b/packages/block-library/src/social-link/index.php @@ -260,7 +260,7 @@ function block_core_social_link_services( $service = '', $field = '' ) { ), 'threads' => array( 'name' => 'Threads', - 'icon' => '', + 'icon' => '', ), 'tiktok' => array( 'name' => 'TikTok', From 85fc0685841a7b891988e4eb7fc186f1c110649c Mon Sep 17 00:00:00 2001 From: Rich Tabor Date: Tue, 25 Jul 2023 12:58:32 -0400 Subject: [PATCH 5/5] Remove fill from the new svg --- packages/block-library/src/social-link/index.php | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/block-library/src/social-link/index.php b/packages/block-library/src/social-link/index.php index 2b3d339fc93aa..1ce60ff49fb41 100644 --- a/packages/block-library/src/social-link/index.php +++ b/packages/block-library/src/social-link/index.php @@ -260,7 +260,7 @@ function block_core_social_link_services( $service = '', $field = '' ) { ), 'threads' => array( 'name' => 'Threads', - 'icon' => '', + 'icon' => '', ), 'tiktok' => array( 'name' => 'TikTok',