decentraland · andyesp · Aug 13, 2024 · Aug 12, 2024 · Aug 12, 2024
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -85,7 +85,7 @@
     "webpack-cli": "^3.3.2"
   },
   "dependencies": {
-    "@dcl/schemas": "^11.9.0",
+    "@dcl/schemas": "^13.5.0",
     "@dcl/ui-env": "^1.5.1",
     "balloon-css": "^0.5.0",
     "classnames": "^2.3.2",

diff --git a/src/components/Icons/Notifications/VotedOnBehalf.tsx b/src/components/Icons/Notifications/VotedOnBehalf.tsx
@@ -0,0 +1,48 @@
+import React from 'react'
+
+function VotedOnBehalf() {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      width="48"
+      height="48"
+      fill="none"
+      viewBox="0 0 48 48"
+    >
+      <circle
+        cx="24"
+        cy="24"
+        r="24"
+        fill="url(#paint0_linear_17208_1928)"
+      ></circle>
+      <g clipPath="url(#clip0_17208_1928)">
+        <path
+          fill="#fff"
+          d="M17.5 18a6 6 0 1012 0 6 6 0 00-12 0zm4.43 9.384l.872 1.453-1.561 5.808-1.688-6.886c-.094-.38-.46-.628-.839-.53A7.56 7.56 0 0013 34.562c0 .797.647 1.439 1.44 1.439H32.56A1.44 1.44 0 0034 34.56a7.56 7.56 0 00-5.714-7.33c-.38-.094-.745.154-.84.53l-1.687 6.885-1.56-5.808.871-1.453a.749.749 0 00-.642-1.134h-1.851a.75.75 0 00-.643 1.134h-.004z"
+        ></path>
+      </g>
+      <defs>
+        <linearGradient
+          id="paint0_linear_17208_1928"
+          x1="0"
+          x2="48"
+          y1="0"
+          y2="48"
+          gradientUnits="userSpaceOnUse"
+        >
+          <stop stopColor="#D80027"></stop>
+          <stop offset="1" stopColor="#720015"></stop>
+        </linearGradient>
+        <clipPath id="clip0_17208_1928">
+          <path
+            fill="#fff"
+            d="M0 0H21V24H0z"
+            transform="translate(13 12)"
+          ></path>
+        </clipPath>
+      </defs>
+    </svg>
+  )
+}
+
+export default VotedOnBehalf
diff --git a/src/components/Icons/Notifications/WhaleVote.tsx b/src/components/Icons/Notifications/WhaleVote.tsx
@@ -0,0 +1,61 @@
+import React from 'react'
+
+function WhaleVote() {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      width="48"
+      height="48"
+      fill="none"
+      viewBox="0 0 48 48"
+    >
+      <circle
+        cx="24"
+        cy="24"
+        r="24"
+        fill="url(#paint0_linear_17208_1929)"
+      ></circle>
+      <g clipPath="url(#clip0_17208_1929)">
+        <mask
+          id="mask0_17208_1929"
+          style={{ maskType: 'luminance' }}
+          width="25"
+          height="25"
+          x="11"
+          y="12"
+          maskUnits="userSpaceOnUse"
+        >
+          <path fill="#fff" d="M36 12H11v25h25V12z"></path>
+        </mask>
+        <g mask="url(#mask0_17208_1929)">
+          <path
+            fill="#fff"
+            d="M28.505 12.195c-.31.13-.545.277-.708.44a2.111 2.111 0 00-.415.61c-.114.244-.18.505-.195.781-.017.277.024.48.122.61.097.13.26.212.488.245.228.032.407 0 .537-.098.13-.098.22-.268.269-.512.049-.245.122-.424.22-.538a.668.668 0 01.39-.22.78.78 0 01.39 0c.098.033.188.09.27.172.08.08.137.17.17.268.032.098.049 1.196.049 3.296 0 2.1.049 3.215.146 3.345.098.13.26.211.489.244a.657.657 0 00.586-.195c.162-.163.244-1.05.244-2.662 0-1.61.016-2.465.049-2.563a.679.679 0 01.17-.269.682.682 0 01.27-.17.78.78 0 01.39 0 .67.67 0 01.39.22c.098.113.171.292.22.536.049.245.138.415.269.513.13.098.276.146.44.146.162 0 .308-.048.439-.146.13-.098.211-.179.244-.244.032-.065.048-.204.048-.415 0-.212-.065-.472-.195-.781a2.147 2.147 0 00-.512-.757 2.215 2.215 0 00-1.49-.586c-.26 0-.464.024-.61.073-.147.049-.277-.057-.39-.317a1.902 1.902 0 00-.513-.684 2.205 2.205 0 00-.684-.415A2.163 2.163 0 0029.36 12c-.261 0-.546.065-.855.195zm-17.26 3.076c-.164.163-.245.61-.245 1.343s.016 1.18.049 1.343c.032.163.114.399.244.708.13.31.317.61.562.903a3.6 3.6 0 00.878.757c.342.212.627.35.855.415.228.065.342.432.342 1.099s.04 1.318.122 1.953c.081.635.179 1.18.293 1.636.114.456.276.968.488 1.538.212.57.447 1.107.708 1.611.26.505.545.985.855 1.44.309.457.691.936 1.147 1.44.456.506.846.888 1.172 1.148.325.261.39.619.195 1.075a6.574 6.574 0 00-.415 1.294 5.557 5.557 0 00-.122 1.074c0 .31.05.529.147.659.097.13.178.212.244.244.065.033.252.049.561.049.31 0 .74-.065 1.294-.196a6.498 6.498 0 001.416-.488c.391-.195.74-.423 1.05-.683.31-.26.675-.342 1.099-.245a9.01 9.01 0 001.514.196 9.673 9.673 0 001.806-.073 9.673 9.673 0 001.563-.318c.422-.13.854-.3 1.293-.512.44-.212.822-.423 1.148-.635.325-.212.724-.53 1.196-.952.472-.423.846-.806 1.123-1.148a9.867 9.867 0 001.367-2.246c.18-.407.326-.806.44-1.196A9.397 9.397 0 0036 25.916c0-.456-.032-.806-.097-1.05a3.195 3.195 0 00-.342-.781 3.53 3.53 0 00-.537-.708 3.523 3.523 0 00-.708-.537 3.471 3.471 0 00-.88-.366c-.309-.082-2.563-.122-6.762-.122-4.2 0-6.389-.017-6.567-.05a2.168 2.168 0 01-1.123-.61c-.18-.179-.31-.374-.391-.586a89.451 89.451 0 01-.122-.317l.464-.17c.309-.115.577-.253.805-.416.228-.163.44-.358.635-.586.195-.228.35-.447.464-.659.114-.212.212-.472.293-.781.081-.31.122-.83.122-1.563 0-.732-.049-1.164-.146-1.294-.098-.13-.18-.211-.245-.244-.065-.032-.236-.049-.512-.049-.277 0-.66.065-1.148.196a5.03 5.03 0 00-1.27.512 5.04 5.04 0 00-.83.586 4.246 4.246 0 00-.61.733c-.212.309-.334.464-.366.464-.033 0-.155-.155-.366-.464-.212-.31-.53-.627-.952-.952-.424-.326-.814-.562-1.172-.708a4.915 4.915 0 00-.928-.293 4.366 4.366 0 00-.806-.074c-.276 0-.496.082-.659.245zM28.04 25.33c.163.033.285.09.366.17.081.082.139.172.171.27a.79.79 0 010 .39.7.7 0 01-.17.366.68.68 0 01-.27.171.779.779 0 01-.39 0 .694.694 0 01-.366-.17.679.679 0 01-.17-.27.778.778 0 010-.39.699.699 0 01.17-.366.69.69 0 01.269-.171.79.79 0 01.39 0zm6.08 1.416h.365l-.17.806c-.115.537-.228.952-.342 1.245-.114.293-.334.708-.66 1.245a8.483 8.483 0 01-1.269 1.587 8.53 8.53 0 01-1.636 1.294 8.178 8.178 0 01-1.684.781c-.554.18-1.01.293-1.367.342-.359.049-.896.057-1.612.024l-1.074-.049.317-.634c.212-.423.374-.904.489-1.44.113-.538.374-.83.781-.88a4.822 4.822 0 001.22-.317 4.999 4.999 0 001.734-1.123 7.08 7.08 0 00.708-.88c.277-.39.553-.699.83-.927a4.25 4.25 0 011.05-.61 5.33 5.33 0 011.294-.366c.44-.065.781-.098 1.025-.098z"
+          ></path>
+        </g>
+      </g>
+      <defs>
+        <linearGradient
+          id="paint0_linear_17208_1929"
+          x1="0"
+          x2="48"
+          y1="0"
+          y2="48"
+          gradientUnits="userSpaceOnUse"
+        >
+          <stop stopColor="#D80027"></stop>
+          <stop offset="1" stopColor="#720015"></stop>
+        </linearGradient>
+        <clipPath id="clip0_17208_1929">
+          <path
+            fill="#fff"
+            d="M0 0H25V25H0z"
+            transform="translate(11 12)"
+          ></path>
+        </clipPath>
+      </defs>
+    </svg>
+  )
+}
+
+export default WhaleVote
diff --git a/...onents/Notifications/NotificationTypes/Governance/GovernanceVotedOnBehalfNotification.tsx b/...onents/Notifications/NotificationTypes/Governance/GovernanceVotedOnBehalfNotification.tsx
@@ -0,0 +1,89 @@
+import React from 'react'
+import {
+  CommonNotificationProps,
+  GovernanceVotedOnBehalfNotification
+} from '../../types'
+import NotificationItem from '../../NotificationItem'
+import VotedOnBehalf from '../../../Icons/Notifications/VotedOnBehalf'
+
+const i18N = {
+  en: {
+    description: (link: string): React.ReactNode => (
+      <>
+        <a href={link} className="dcl notification-link">
+          See if their vote is aligned
+        </a>
+        with your vision. You can always override their decision by voting on
+        your own.
+      </>
+    ),
+    title: (proposalTitle: string): React.ReactNode => (
+      <>
+        Your delegate voted on the proposal "
+        <span className="dcl notification-text-highlighted">
+          {proposalTitle}
+        </span>
+        "
+      </>
+    )
+  },
+  es: {
+    description: (link: string): React.ReactNode => (
+      <>
+        <a href={link} className="dcl notification-link">
+          Verifica si su voto está alineado
+        </a>
+        con tu visión. Siempre puedes anular su decisión votando por tu cuenta.
+      </>
+    ),
+    title: (proposalTitle: string): React.ReactNode => (
+      <>
+        Tu delegado votó en la propuesta "
+        <span className="dcl notification-text-highlighted">
+          {proposalTitle}
+        </span>
+        "
+      </>
+    )
+  },
+  zh: {
+    description: (link: string): React.ReactNode => (
+      <>
+        <a href={link} className="dcl notification-link">
+          查看他们的投票是否符合您的愿景。
+        </a>
+        您始终可以通过自己投票来推翻他们的决定。
+      </>
+    ),
+    title: (proposalTitle: string): React.ReactNode => (
+      <>
+        您的委托人在提案"
+        <span className="dcl notification-text-highlighted">
+          {proposalTitle}
+        </span>
+        "上投了票
+      </>
+    )
+  }
+}
+
+const GovernanceVotedOnBehalfNotification = ({
+  notification,
+  locale
+}: CommonNotificationProps<GovernanceVotedOnBehalfNotification>) => (
+  <NotificationItem
+    image={{ image: <VotedOnBehalf /> }}
+    timestamp={notification.timestamp}
+    isNew={!notification.read}
+    locale={locale}
+  >
+    <p className="dcl notification-item__content-title">
+      {i18N[locale].title(notification.metadata.proposalTitle)}
+    </p>
+    <p className="dcl notification-item__content-description">
+      {i18N[locale].description(notification.metadata.link)}
+    </p>
+  </NotificationItem>
+)
+
+export default GovernanceVotedOnBehalfNotification
diff --git a/...components/Notifications/NotificationTypes/Governance/GovernanceWhaleVoteNotification.tsx b/...components/Notifications/NotificationTypes/Governance/GovernanceWhaleVoteNotification.tsx
@@ -0,0 +1,91 @@
+import React from 'react'
+import {
+  CommonNotificationProps,
+  GovernanceWhaleVoteNotification
+} from '../../types'
+import NotificationItem from '../../NotificationItem'
+import WhaleVote from '../../../Icons/Notifications/WhaleVote'
+
+const i18N = {
+  en: {
+    description: (link: string): React.ReactNode => (
+      <>
+        A wallet holding over 250k VP has just{' '}
+        <a href={link} className="dcl notification-link">
+          cast a vote
+        </a>
+        . Stay informed and see how this significant vote impacts the outcome.
+      </>
+    ),
+    title: (proposalTitle: string): React.ReactNode => (
+      <>
+        A whale voted on your proposal "
+        <span className="dcl notification-text-highlighted">
+          {proposalTitle}
+        </span>
+        "
+      </>
+    )
+  },
+  es: {
+    description: (link: string): React.ReactNode => (
+      <>
+        Una billetera con más de 250k VP acaba de{' '}
+        <a href={link} className="dcl notification-link">
+          emitir un voto
+        </a>
+        . Mantente informado y revisa cómo este voto significativo impacta el
+        resultado.
+      </>
+    ),
+    title: (proposalTitle: string): React.ReactNode => (
+      <>
+        Una ballena votó en tu propuesta "
+        <span className="dcl notification-text-highlighted">
+          {proposalTitle}
+        </span>
+        "
+      </>
+    )
+  },
+  zh: {
+    description: (link: string): React.ReactNode => (
+      <>
+        <a href={link} className="dcl notification-link">
+          一个持有超过25万VP的钱包刚刚投票。
+        </a>
+        保持关注，看看这一重要投票如何影响最终结果。
+      </>
+    ),
+    title: (proposalTitle: string): React.ReactNode => (
+      <>
+        一位鲸鱼对您的提案“
+        <span className="dcl notification-text-highlighted">
+          {proposalTitle}
+        </span>
+        ”进行了投票
+      </>
+    )
+  }
+}
+
+const GovernanceWhaleVoteNotification = ({
+  notification,
+  locale
+}: CommonNotificationProps<GovernanceWhaleVoteNotification>) => (
+  <NotificationItem
+    image={{ image: <WhaleVote /> }}
+    timestamp={notification.timestamp}
+    isNew={!notification.read}
+    locale={locale}
+  >
+    <p className="dcl notification-item__content-title">
+      {i18N[locale].title(notification.metadata.proposalTitle)}
+    </p>
+    <p className="dcl notification-item__content-description">
+      {i18N[locale].description(notification.metadata.link)}
+    </p>
+  </NotificationItem>
+)
+
+export default GovernanceWhaleVoteNotification
diff --git a/src/components/Notifications/NotificationTypes/index.ts b/src/components/Notifications/NotificationTypes/index.ts
@@ -16,6 +16,8 @@ import GovernanceProposalEnactedNotification from './Governance/GovernancePropos
 import GovernanceVotingEndedVoterNotification from './Governance/GovernanceVotingEndedVoterNotification'
 import GovernanceTenderPassedNotification from './Governance/GovernanceTenderPassedNotification'
 import GovernancePitchPassedNotification from './Governance/GovernancePitchPassedNotification'
+import GovernanceVotedOnBehalfNotification from './Governance/GovernanceVotedOnBehalfNotification'
+import GovernanceWhaleVoteNotification from './Governance/GovernanceWhaleVoteNotification'
 import LandRentedNotification from './Land/LandRentedNotification'
 import LandRentalEndedNotification from './Land/LandRentalEndedNotification'
 import RewardAssignedNotification from './Reward/RewardAssignedNotification'
@@ -39,6 +41,8 @@ export {
   GovernanceVotingEndedVoterNotification,
   GovernancePitchPassedNotification,
   GovernanceTenderPassedNotification,
+  GovernanceVotedOnBehalfNotification,
+  GovernanceWhaleVoteNotification,
   LandRentalEndedNotification,
   LandRentedNotification,
   RewardAssignedNotification,