feat: update copy from Twitter to X and refresh icons (DPS-4429) (#1552)

feat: update copy from Twitter to X and refresh icons

Co-authored-by: Artur Fracala <[email protected]>

Author: arturfracala

.env.development

@@ -1,6 +1,6 @@
 NEXT_PUBLIC_CLIENT_ID=e9627d805c0e5322c747735eb0178f4f
 NEXT_PUBLIC_DISCORD_FOOTER_URL=https://discord.gg/MGFyhbdFxt
-NEXT_PUBLIC_TWITTER_LIVECHAT=https://twitter.com/TextPlatform
+NEXT_PUBLIC_X_LIVECHAT=https://x.com/TextPlatform
 NEXT_PUBLIC_GITHUB_LIVECHAT=https://github.com/livechat/livechat-public-docs
 NEXT_PUBLIC_SERVER_URL=https://accounts.labs.livechat.com
 NEXT_PUBLIC_LC_API_URL=https://api.labs.livechatinc.com

.env.production

@@ -1,6 +1,6 @@
 NEXT_PUBLIC_CLIENT_ID=49aba739e5310548611ec9a209f7ac03
 NEXT_PUBLIC_DISCORD_FOOTER_URL=https://discord.gg/MGFyhbdFxt
-NEXT_PUBLIC_TWITTER_LIVECHAT=https://twitter.com/TextPlatform
+NEXT_PUBLIC_X_LIVECHAT=https://x.com/TextPlatform
 NEXT_PUBLIC_GITHUB_LIVECHAT=https://github.com/livechat/livechat-public-docs
 NEXT_PUBLIC_SERVER_URL=https://accounts.livechat.com
 NEXT_PUBLIC_LC_API_URL=https://api.livechatinc.com

README.md

@@ -55,4 +55,4 @@ All contribution's welcome! [Read how to do it.](./CONTRIBUTING.md)
 - [Create a free developer account](https://platform.text.com/console/) in our Developer Program.
 - [Join our Discord for Developers](https://discord.gg/rFbJkYQFwp)
 - Send us an email at [email protected]
-- Follow us on [Twitter](https://twitter.com/LiveChatDev)
+- Follow us on [X](https://x.com/TextPlatform)

src/assets/icons/X.js

@@ -0,0 +1,11 @@
+export const XIcon = ({ ...rest }) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 50 50"
+    width="50px"
+    height="50px"
+    {...rest}
+  >
+    <path d="M 11 4 C 7.1456661 4 4 7.1456661 4 11 L 4 39 C 4 42.854334 7.1456661 46 11 46 L 39 46 C 42.854334 46 46 42.854334 46 39 L 46 11 C 46 7.1456661 42.854334 4 39 4 L 11 4 z M 11 6 L 39 6 C 41.773666 6 44 8.2263339 44 11 L 44 39 C 44 41.773666 41.773666 44 39 44 L 11 44 C 8.2263339 44 6 41.773666 6 39 L 6 11 C 6 8.2263339 8.2263339 6 11 6 z M 13.085938 13 L 22.308594 26.103516 L 13 37 L 15.5 37 L 23.4375 27.707031 L 29.976562 37 L 37.914062 37 L 27.789062 22.613281 L 36 13 L 33.5 13 L 26.660156 21.009766 L 21.023438 13 L 13.085938 13 z M 16.914062 15 L 19.978516 15 L 34.085938 35 L 31.021484 35 L 16.914062 15 z" />
+  </svg>
+);

src/components/core/Footer/Footer.js

@@ -1,11 +1,11 @@
 import React from "react";
 /** @jsx jsx */
 import { jsx, css } from "@emotion/core";
-import Twitter from "react-material-icon-svg/dist/Twitter";
 import Github from "react-material-icon-svg/dist/Github";
 
 import FooterBox from "./FooterBox";
 import { Discord } from "../../../assets/icons/Discord";
+import { XIcon } from "../../../assets/icons/X";
 
 const wrapperCss = () => css`
   display: flex;
@@ -34,9 +34,9 @@ const footerData = [
   {
     title: "Follow us",
     content: "Follow our insightful tweets and interact with our content.",
-    buttonIcon: <Twitter />,
-    buttonCopy: "Twitter",
-    buttonLink: process.env.NEXT_PUBLIC_TWITTER_LIVECHAT,
+    buttonIcon: <XIcon />,
+    buttonCopy: "X (Twitter)",
+    buttonLink: process.env.NEXT_PUBLIC_X_LIVECHAT,
   },
   {
     title: "Contribute",

src/constants/header.js

@@ -1,8 +1,8 @@
 import React from "react";
-import Twitter from "react-material-icon-svg/dist/Twitter";
 import Github from "react-material-icon-svg/dist/Github";
 import UnfoldMoreVertical from "react-material-icon-svg/dist/UnfoldMoreVertical";
 import { Discord } from "assets/icons/Discord";
+import { XIcon } from "assets/icons/X";
 import { UpdatesIcon } from "assets/icons/Updates";
 import { MessagingIcon } from "assets/icons/cards/Messaging";
 import { ManagementIcon } from "assets/icons/cards/Management";
@@ -188,9 +188,9 @@ export const connects = [
     secondaryIcon: <Github fill="#ffffff" />,
   },
   {
-    title: "Platform Twitter",
-    link: process.env.NEXT_PUBLIC_TWITTER_LIVECHAT,
-    primaryIcon: <Twitter />,
-    secondaryIcon: <Twitter fill="#ffffff" />,
+    title: "Platform X",
+    link: process.env.NEXT_PUBLIC_X_LIVECHAT,
+    primaryIcon: <XIcon />,
+    secondaryIcon: <XIcon fill="#ffffff" />,
   },
 ];