videos

package.json

@@ -37,6 +37,7 @@
     "i18next-http-backend": "^2.2.0",
     "i18next-localstorage-backend": "^4.1.1",
     "lodash": "^4.17.21",
+    "marked": "^10.0.0",
     "moment": "^2.29.4",
     "moment-timezone": "^0.5.43",
     "qrcode.react": "^3.1.0",
@@ -65,7 +66,7 @@
     "remove-markdown": "^0.5.0",
     "ton": "^13.4.1",
     "ton-core": "^0.48.0",
-    "ton-vote-contracts-sdk": "^1.5.7",
+    "ton-vote-contracts-sdk": "^1.5.21",
     "tonweb": "^0.0.60",
     "use-query-params": "^2.2.0",
     "yup": "^1.1.1",

src/components/Markdown.tsx

@@ -1,29 +1,32 @@
 import { Box, styled } from "@mui/material";
-import React, { forwardRef } from "react";
-import ReactMarkdown from "react-markdown";
-
- export const Markdown = React.forwardRef(
-   (
-     { children = "", className }: { children?: string; className?: string },
-     ref: any
-   ) => (
-     <StyledMarkdown
-       className={className}
-       ref={ref}
-     >
-       <ReactMarkdown linkTarget="_blank">{children}</ReactMarkdown>
-     </StyledMarkdown>
-   )
- );
+import {  useRef } from "react";
+import { marked } from "marked";
 
+export const Markdown = ({
+  children = "",
+  className,
+}: {
+  children?: string;
+  className?: string;
+}) => {
 
+  const ref = useRef<HTMLDivElement>();
 
+  return (
+    <StyledMarkdown
+      ref={ref}
+      className={className}
+      dangerouslySetInnerHTML={{ __html: marked.parse(children) }}
+    />
+  );
+};
 
 export const StyledMarkdown = styled(Box)(({ theme }) => ({
   img: {
     maxWidth: "100%",
     marginTop: 10,
   },
+
   "*": {
     wordBreak: "break-word",
     color: theme.palette.text.primary,
@@ -33,6 +36,18 @@ export const StyledMarkdown = styled(Box)(({ theme }) => ({
       marginBottom: 0,
     },
   },
+  iframe: {
+    width: "100%",
+    maxHeight: 350,
+    height: "30vw",
+    minHeight: 200,
+  },
+  video: {
+    width: "100%",
+    maxHeight: 350,
+    height: "30vw",
+    minHeight: 200,
+  },
   p: {
     fontSize: 16,
   },
@@ -54,3 +69,5 @@ export const StyledMarkdown = styled(Box)(({ theme }) => ({
     color: theme.palette.primary.main,
   },
 }));
+
+

src/components/ShareButton.tsx

@@ -1,11 +1,10 @@
 import { Box, MenuItem, styled, Typography } from "@mui/material";
 import { useCopyToClipboard } from "hooks/hooks";
-import React, { useState } from "react";
+import React, { ReactNode, useState } from "react";
 import { BsReddit, BsTwitter } from "react-icons/bs";
 import { FaTelegramPlane } from "react-icons/fa";
 import { IoCopyOutline } from "react-icons/io5";
 import { RxShare2 } from "react-icons/rx";
-import { ReactNode } from "react-markdown/lib/react-markdown";
 
 import {
   RedditShareButton,

src/config.ts

@@ -74,6 +74,7 @@ export const VERIFIED_DAOS = [
   "EQATOALRdF-1caUrqNRW3NKfoXHFqO_a_tcIIMBNYCqTI1fG",
   "EQCsKT7341lTP1BEV9dFzcgjJv8wCdCqpvtoK2c18zO2e5GE",
   "EQBM94_9VlmsBbKwbjd1FQgNl9zZLl0cUgBGochRANNZpUzf",
+  "EQBvInxcrQhZxeIqA28s6KLYHmS2GrBcTIrX1oMPNoZpOMaQ",
 ];
 
 export const releaseMode = import.meta.env.VITE_STAGING

src/consts.ts

@@ -34,4 +34,5 @@ export const MOBILE_WIDTH = 768;
 
 
 export const ONE_WALLET_ONE_VOTE_URL =
-  "https://github.com/orbs-network/ton-vote/blob/main/README.md#supported-strategies";
+  "https://github.com/orbs-network/ton-vote/blob/main/README.md#supported-strategies";
+

src/data/foundation/proposals-descriptions/index.ts

@@ -0,0 +1,12 @@
+import { LATEST_FOUNDATION_PROPOSAL_ADDRESS } from "../data";
+import { LATEST_TF_PROPOSAL_DESCRIPTION } from "../description";
+import { THE_OPEN_LEAGUE_DESCRIPTION } from "./the-open-league";
+
+const hardocded = {
+  EQA5eyWDAAegbL5Ay1CfelGG3yY9Ow7bgpfocTV6KDt9zeIl: THE_OPEN_LEAGUE_DESCRIPTION,
+  [LATEST_FOUNDATION_PROPOSAL_ADDRESS]: LATEST_TF_PROPOSAL_DESCRIPTION,
+};
+
+export const getProposalDescription = (address: string, decription?: string) => {
+  return hardocded[address as keyof typeof hardocded] || decription;
+};

src/data/foundation/proposals-descriptions/the-open-league.ts

@@ -0,0 +1,46 @@
+export const THE_OPEN_LEAGUE_DESCRIPTION = `
+<video autoplay muted controls>
+  <source src="https://tonv.s3.us-east-2.amazonaws.com/TON+Conference+v4.mp4" type="video/mp4">
+Your browser does not support the video tag.
+</video>
+
+The Open League is a community proposal to distribute TON-backed user incentives and acquire 5 million users in the next 12 months. This proposal is to gather support and feedback for the first season, an invite-only Pilot Season, to create a proof of concept for the ecosystem.
+
+-   You can watch the full presentation from Gateway Here: https://www.youtube.com/watch?v=vsAyfdmt374&t=10085s
+
+-   You can download the full presentation here: https://drive.google.com/file/d/1gKuzQJjoC1sfsbY1GNTvNWeg1Eya5ua3/view?usp=sharing
+
+How The Open League would work:
+
+Incentives would go to users in 2 ways:
+
+-   Soul-bound tokens (SBTs) - given for sustained on-chain activity
+
+-   Via projects that are awarded incentives grants by community vote
+
+A seasonal structure would gamify mini-app launches.
+
+-   For Projects: Creating perfect moments to captivate and onboard active users from Telegram to TON.
+
+-   For Users: Directing them to the best projects gamifying onboarding with incentives for TON mini-app usage.
+
+Experience Points (XP) would become reputation points and be redeemable for $TON
+
+-   XP, backed 1:1 with $TON, can be exchanged for $TON anytime. 
+
+-   The twist? A time-based formula affects the exchange rate -- the sooner you redeem, the higher the discount. 
+
+-   On March 31, 2025, 1 XP will equal 1 $TON.
+
+Community bot quests will act as the front page for incentive season tasks.
+
+-   Earn XP for task completion and receive SBTs for completing the entire set. 
+
+-   SBTs offer a permanent boost in XP earnings, and you can amplify your gains by referring friends, getting Telegram Premium, or buying a TON DNS.
+
+TON Society would become your new TON public profile, tracking your achievements, earnings, and enabling the exchange of XP for TON. From Season 1, TON Society members will also help govern the program - First, voting for TON projects to get XP grants. Projects would apply for 1 of the 3 tiers, where they should show why they believe they can achieve the User goal---creating an investor pitch for the entire community.
+
+This system aims to activate 5 million Telegram users to TON in 1 year. To do that, we'd spend 1 year as an ecosystem growing TON-based TG mini-apps, 3 seasons, creating 3 opportunities to review performance and evolve the program better to meet the needs of projects and the community while reaching its goal.
+
+Your vote today would be to approve the pilot season, targeting 500k active users and enabling us to build the League and begin testing SBTs, and XP incentives on a small handful of projects.
+`;

src/pages/proposal/ProposalDisplay/ProposalAbout.tsx

@@ -31,7 +31,6 @@ const MIN_DESCRIPTION_HEIGHT = 200;
 export const ProposalAbout = () => {
   const mobile = useMobile();
 
-
   return (
     <StyledContainer>
       {mobile ? <MobileAbout /> : <DesktopAbout />}
@@ -75,7 +74,7 @@ function MobileAbout() {
 
 const ProposalHeader = () => {
   const { proposalAddress } = useAppParams();
-  const {data, isLoading} = useProposalQuery(proposalAddress);
+  const { data, isLoading } = useProposalQuery(proposalAddress);
 
   const mockPrefix = mock.isMockProposal(proposalAddress) ? " (Mock)" : "";
 
@@ -84,21 +83,20 @@ const ProposalHeader = () => {
   if (isLoading) {
     return <StyledSkeletonLoader />;
   }
-    return (
-      <StyledFlexRow>
-        <StyledHeader title={`${title}${mockPrefix}`} />
-        {data && <StyledHiddenProposal proposal={data} />}
-      </StyledFlexRow>
-    );
+  return (
+    <StyledFlexRow>
+      <StyledHeader title={`${title}${mockPrefix}`} />
+      {data && <StyledHiddenProposal proposal={data} />}
+    </StyledFlexRow>
+  );
 };
 
 const StyledHiddenProposal = styled(HiddenProposal)({
-  position:'absolute',
+  position: "absolute",
   top: 7,
-  right: 7
+  right: 7,
 });
 
-
 const ShowMoreButton = ({
   onClick,
   showMore,
@@ -143,15 +141,14 @@ const Description = () => {
       ? MIN_DESCRIPTION_HEIGHT
       : descriptionHeight;
 
-
-      if (isLoading) {
-        return (
-          <StyledFlexColumn alignItems='flex-start'>
-            <StyledSkeletonLoader width='70%' />
-            <StyledSkeletonLoader />
-          </StyledFlexColumn>
-        );
-      }
+  if (isLoading) {
+    return (
+      <StyledFlexColumn alignItems="flex-start">
+        <StyledSkeletonLoader width="70%" />
+        <StyledSkeletonLoader />
+      </StyledFlexColumn>
+    );
+  }
 
   return (
     <StyledDescription>
@@ -170,6 +167,7 @@ const Description = () => {
 
 const StyledDescription = styled(Box)({
   position: "relative",
+  width: "100%",
 });
 
 const StyledPlaceholder = styled("span")({
@@ -197,7 +195,7 @@ const StyledHeader = styled(Header)({
 });
 
 const ProposalStatus = () => {
-  const {proposalAddress} = useAppParams()
+  const { proposalAddress } = useAppParams();
   const { proposalStatusText } = useProposalStatus(proposalAddress);
 
   return <Status status={proposalStatusText} />;

src/query/getters.ts

@@ -48,6 +48,7 @@ import { routes } from "consts";
 import { lib } from "lib";
 import { useAnalytics } from "analytics";
 import { LATEST_TF_PROPOSAL_DESCRIPTION } from "data/foundation/description";
+import { getProposalDescription } from "data/foundation/proposals-descriptions";
 
 export const useRegistryStateQuery = () => {
   const clients = useGetClients().data;
@@ -292,7 +293,6 @@ export const useConnectedWalletVotingPowerQuery = (
         strategy,
         allNftHolders
       );
-
 
       const symbol = getProposalSymbol(
         proposal?.metadata?.votingPowerStrategies
@@ -379,16 +379,16 @@ const useGetProposalWithFallback = (proposalAddress: string) => {
       proposal = queryClient.getQueryData<Proposal | undefined>(key);
     }
 
-    if (proposal && proposalAddress === LATEST_FOUNDATION_PROPOSAL_ADDRESS) {
-      proposal = {
-        ...proposal,
-        metadata: {
-          ...proposal?.metadata,
-          description: LATEST_TF_PROPOSAL_DESCRIPTION,
-        },
-      } as Proposal;
-    }
-
+    proposal = {
+      ...proposal,
+      metadata: {
+        ...proposal?.metadata,
+        description: getProposalDescription(
+          proposalAddress!,
+          proposal?.metadata?.description
+        ),
+      },
+    } as Proposal;
     return proposal;
   };
 };

yarn.lock

@@ -1977,6 +1977,11 @@ magic-string@^0.27.0:
   dependencies:
     "@jridgewell/sourcemap-codec" "^1.4.13"
 
+marked@^10.0.0:
+  version "10.0.0"
+  resolved "https://registry.yarnpkg.com/marked/-/marked-10.0.0.tgz#7fe1805bb908433d760e2de0fcc8841a2b2d745c"
+  integrity sha512-YiGcYcWj50YrwBgNzFoYhQ1hT6GmQbFG8SksnYJX1z4BXTHSOrz1GB5/Jm2yQvMg4nN1FHP4M6r03R10KrVUiA==
+
 mdast-util-definitions@^5.0.0:
   version "5.1.2"
   resolved "https://registry.npmjs.org/mdast-util-definitions/-/mdast-util-definitions-5.1.2.tgz"
@@ -2900,10 +2905,10 @@ ton-crypto@^3.2.0:
     ton-crypto-primitives "2.0.0"
     tweetnacl "1.0.3"
 
-ton-vote-contracts-sdk@^1.5.7:
-  version "1.5.7"
-  resolved "https://registry.yarnpkg.com/ton-vote-contracts-sdk/-/ton-vote-contracts-sdk-1.5.7.tgz#9fc919b1fe4eb2f26f822423bdc3944ccbd7b32b"
-  integrity sha512-Z+1dekdzThyCTUwqpEKIPmc4N+ljTJEZdW2An6DhvQGPNd0WNrWG3TBt2ZEBwEReYzSnakG1qaUO5uCxBvwVbQ==
+ton-vote-contracts-sdk@^1.5.21:
+  version "1.5.21"
+  resolved "https://registry.yarnpkg.com/ton-vote-contracts-sdk/-/ton-vote-contracts-sdk-1.5.21.tgz#0d923729802184a2b7128adae363c55c6643666a"
+  integrity sha512-TJphTj8UFg4aZHB+ixmprwCId3DBC2eKpkbdDwH0+T26Q/WTECByLK3ArUSORaoZgRDLK5HZ7IfTWFVZsSxyxA==
   dependencies:
     "@aws-crypto/sha256-js" "^4.0.0"
     "@orbs-network/ton-access" "^2.2.2"