Merge pull request #4424 from jbx-protocol/dev

release: 2024-08-10

src/components/Create/components/pages/ReconfigurationRules/ReconfigurationRulesPage.tsx

@@ -15,10 +15,12 @@ import {
   TERMINAL_MIGRATION_EXPLANATION,
 } from 'components/strings'
 import { CREATE_FLOW } from 'constants/fathomEvents'
+import { FEATURE_FLAGS } from 'constants/featureFlags'
 import { readNetwork } from 'constants/networks'
 import { trackFathomGoal } from 'lib/fathom'
 import { useContext } from 'react'
 import { useSetCreateFurthestPageReached } from 'redux/hooks/useEditingCreateFurthestPageReached'
+import { featureFlagEnabled } from 'utils/featureFlags'
 import { CreateCollapse } from '../../CreateCollapse/CreateCollapse'
 import { PageContext } from '../../Wizard/contexts/PageContext'
 import { Wizard } from '../../Wizard/Wizard'
@@ -82,12 +84,14 @@ export const ReconfigurationRulesPage = () => {
               <JuiceSwitch label={t`Hold fees`} />
             </Form.Item>
 
-            {/* <Form.Item
-              name="projectRequiredOFACCheck"
-              extra={t`Disallow payments from users who appear on OFAC’s Specially Designated Nationals (SDN) list. Note: payments are still possible on other websites (for example, Etherscan).`}
-            >
-              <JuiceSwitch label={t`OFAC Sanctions screening`} />
-            </Form.Item> */}
+            {featureFlagEnabled(FEATURE_FLAGS.OFAC) ? (
+              <Form.Item
+                name="projectRequiredOFACCheck"
+                extra={t`Disallow payments from users who appear on OFAC’s Specially Designated Nationals (SDN) list. Note: payments are still possible on other websites (for example, Etherscan).`}
+              >
+                <JuiceSwitch label={t`OFAC Sanctions screening`} />
+              </Form.Item>
+            ) : null}
           </CreateCollapse.Panel>
           <CreateCollapse.Panel
             key={1}

src/components/Create/components/pages/ReviewDeploy/components/RulesReview/RulesReview.tsx

@@ -1,5 +1,7 @@
 import { t } from '@lingui/macro'
 import EthereumAddress from 'components/EthereumAddress'
+import { FEATURE_FLAGS } from 'constants/featureFlags'
+import { featureFlagEnabled } from 'utils/featureFlags'
 import { ReviewDescription } from '../ReviewDescription'
 import { useRulesReview } from './hooks/useRulesReview'
 
@@ -13,7 +15,7 @@ export const RulesReview = () => {
     terminalMigration,
     controllerMigration,
     holdFees,
-    // ofac,
+    ofac,
   } = useRulesReview()
 
   return (
@@ -63,10 +65,12 @@ export const RulesReview = () => {
           <div className="text-base font-medium">{controllerMigration}</div>
         }
       />
-      {/* <ReviewDescription
-        title={t`OFAC Sanctions screening`}
-        desc={<div className="text-base font-medium">{ofac}</div>}
-      /> */}
+      {featureFlagEnabled(FEATURE_FLAGS.OFAC) ? (
+        <ReviewDescription
+          title={t`OFAC Sanctions screening`}
+          desc={<div className="text-base font-medium">{ofac}</div>}
+        />
+      ) : null}
     </div>
   )
 }

src/constants/featureFlags.ts

@@ -1,6 +1,7 @@
-export type FeatureFlag = 'SIMULATE_TXS' | 'V4'
+export type FeatureFlag = 'SIMULATE_TXS' | 'V4' | 'OFAC'
 
 export const FEATURE_FLAGS: { [k in FeatureFlag]: string } = {
   SIMULATE_TXS: 'simulateTxs',
   V4: 'v4',
+  OFAC: 'ofac',
 }

src/locales/messages.pot

@@ -152,6 +152,9 @@ msgstr ""
 msgid "An address"
 msgstr ""
 
+msgid "Activating this option enables running the user's wallet address against OFAC’s Specially Designated Nationals (SDN) list"
+msgstr ""
+
 msgid "Pay {0}"
 msgstr ""
 
@@ -1748,6 +1751,9 @@ msgstr ""
 msgid "About the protocol"
 msgstr ""
 
+msgid "OFAC Sanctions screening"
+msgstr ""
+
 msgid "Existing project payer addresses can be found in the Tools drawer (<0/>) on the project page."
 msgstr ""
 
@@ -2309,6 +2315,9 @@ msgstr ""
 msgid "to close"
 msgstr ""
 
+msgid "Disallow payments from users who appear on OFAC’s Specially Designated Nationals (SDN) list. Note: payments are still possible on other websites (for example, Etherscan)."
+msgstr ""
+
 msgid "Immediately"
 msgstr ""
 
@@ -3074,6 +3083,9 @@ msgstr ""
 msgid "If you don't plan on unlocking the held fees later on, you can use the button below to process them now. When you press the button, the held fees will be used to buy $JBX. This cannot be undone."
 msgstr ""
 
+msgid "Check User Wallet Address"
+msgstr ""
+
 msgid "Set ENS text record for {ensName}"
 msgstr ""
 
@@ -3692,6 +3704,9 @@ msgstr ""
 msgid "Payment amount can't exceed your wallet balance."
 msgstr ""
 
+msgid "Additional settings"
+msgstr ""
+
 msgid "Last paid"
 msgstr ""
 

src/packages/v2v3/components/V2V3Project/ProjectDashboard/components/AboutPanel/AboutPanel.tsx

@@ -1,7 +1,7 @@
 import { t } from '@lingui/macro'
+import { EmptyScreen } from 'components/Project/ProjectTabs/EmptyScreen'
 import { RichPreview } from 'components/RichPreview/RichPreview'
 import { useAboutPanel } from 'packages/v2v3/components/V2V3Project/ProjectDashboard/hooks/useAboutPanel'
-import { EmptyScreen } from '../EmptyScreen'
 
 export const AboutPanel = () => {
   const { description } = useAboutPanel()

src/packages/v2v3/components/V2V3Project/ProjectDashboard/components/NftRewardsPanel/NftRewardsPanel.tsx

@@ -1,5 +1,5 @@
 import { Trans, t } from '@lingui/macro'
-import { EmptyScreen } from '../EmptyScreen'
+import { EmptyScreen } from 'components/Project/ProjectTabs/EmptyScreen'
 import { NftReward, NftRewardSkeleton } from './NftReward/NftReward'
 import { RedeemNftsSection } from './RedeemNftsSection/RedeemNftsSection'
 import { useNftRewardsPanel } from './hooks/useNftRewardsPanel'

src/packages/v2v3/components/V2V3Project/V2V3ProjectSettings/pages/ProjectDetailsSettingsPage/ProjectDetailsForm.tsx

@@ -3,12 +3,15 @@ import { Button, Form, FormInstance } from 'antd'
 import { useWatch } from 'antd/lib/form/Form'
 import { FormItems } from 'components/formItems'
 import { FormImageUploader } from 'components/inputs/FormImageUploader'
+import { JuiceSwitch } from 'components/inputs/JuiceSwitch'
 import { JuiceInput } from 'components/inputs/JuiceTextInput'
 import { MinimalCollapse } from 'components/MinimalCollapse'
 import { RichEditor } from 'components/RichEditor'
+import { FEATURE_FLAGS } from 'constants/featureFlags'
 
 import { ProjectTagName } from 'models/project-tags'
 import { inputIsLengthRule } from 'utils/antdRules/inputIsLengthRule'
+import { featureFlagEnabled } from 'utils/featureFlags'
 import { normalizeHandle } from 'utils/format/formatHandle'
 
 export type ProjectDetailsFormFields = {
@@ -145,17 +148,21 @@ export function ProjectDetailsForm({
             <FormItems.ProjectPayDisclosure name="payDisclosure" />
           </MinimalCollapse>
         </div>
-        {/* <div>
-          <MinimalCollapse header={<Trans>Additional settings</Trans>}>
-            <Form.Item
-              name="projectRequiredOFACCheck"
-              label={t`OFAC Sanctions screening`}
-              extra={t`Activating this option enables running the user's wallet address against OFAC’s Specially Designated Nationals (SDN) list`}
-            >
-              <JuiceSwitch label={t`Check User Wallet Address`} />
-            </Form.Item>
-          </MinimalCollapse>
-        </div> */}
+
+        {featureFlagEnabled(FEATURE_FLAGS.OFAC) ? (
+          <div>
+            <MinimalCollapse header={<Trans>Additional settings</Trans>}>
+              <Form.Item
+                name="projectRequiredOFACCheck"
+                label={t`OFAC Sanctions screening`}
+                extra={t`Activating this option enables running the user's wallet address against OFAC’s Specially Designated Nationals (SDN) list`}
+              >
+                <JuiceSwitch label={t`Check User Wallet Address`} />
+              </Form.Item>
+            </MinimalCollapse>
+          </div>
+        ) : null}
+
         <div>
           <Form.Item>
             {saveButton ?? (

src/packages/v4/views/V4ProjectDashboard/V4ProjectTabs/V4AboutPanel/V4AboutPanel.tsx

@@ -0,0 +1,21 @@
+import { t } from "@lingui/macro"
+import { EmptyScreen } from "components/Project/ProjectTabs/EmptyScreen"
+import { RichPreview } from "components/RichPreview/RichPreview"
+import { useV4AboutPanel } from "./hooks/useV4AboutPanel"
+
+export const V4AboutPanel = () => {
+  const { description } = useV4AboutPanel()
+  return (
+    <div className="flex min-h-[384px] w-full flex-col gap-8 md:gap-10">
+      <div className="flex flex-col gap-4 whitespace-pre-wrap">
+        {description ? (
+          <RichPreview source={description} />
+        ) : (
+          <>
+            <EmptyScreen subtitle={t`This project has no description`} />
+          </>
+        )}
+      </div>
+    </div>
+  )
+}

src/packages/v4/views/V4ProjectDashboard/V4ProjectTabs/V4AboutPanel/hooks/useV4AboutPanel.ts

@@ -0,0 +1,27 @@
+import { useJBProjectMetadataContext } from 'juice-sdk-react'
+import { wrapNonAnchorsInAnchor } from 'utils/wrapNonAnchorsInAnchor'
+
+export type SocialLink = 'twitter' | 'discord' | 'telegram' | 'website'
+
+export const useV4AboutPanel = () => {
+  const { metadata } = useJBProjectMetadataContext()
+  const projectMetadata = metadata?.data
+
+  const description = projectMetadata?.description
+    ? addHttpsToDescriptionUrls(
+        wrapNonAnchorsInAnchor(projectMetadata?.description),
+      )
+    : undefined
+
+
+  return {
+    description,
+    projectName: projectMetadata?.name,
+  }
+}
+
+const addHttpsToDescriptionUrls = (description: string) => {
+  // find all dangling a hrefs missing a https:// or http:// or any protocol and add https://
+  const urlRegex = /<a href="((?!http|https).+?)"/g
+  return description.replace(urlRegex, '<a href="https://$1"')
+}

src/packages/v4/views/V4ProjectDashboard/V4ProjectTabs/V4AboutPanel/index.ts

@@ -0,0 +1,3 @@
+import { V4AboutPanel } from "./V4AboutPanel";
+
+export default V4AboutPanel;

src/packages/v4/views/V4ProjectDashboard/V4ProjectTabs/V4ProjectTabs.tsx

@@ -5,6 +5,7 @@ import { useOnScreen } from 'hooks/useOnScreen'
 import { Fragment, useEffect, useMemo, useRef, useState } from 'react'
 import { twMerge } from 'tailwind-merge'
 import { useProjectPageQueries } from '../hooks/useProjectPageQueries'
+import V4AboutPanel from './V4AboutPanel'
 import { V4ActivityPanel } from './V4ActivityPanel/V4ActivityPanel'
 import { V4CyclesPayoutsPanel } from './V4CyclesPayoutsPanel/V4CyclesPayoutsPanel'
 import { V4TokensPanel } from './V4TokensPanel/V4TokensPanel'
@@ -45,7 +46,7 @@ export const V4ProjectTabs = ({ className }: { className?: string }) => {
   const tabs: ProjectTabConfig[] = useMemo(
     () => [
       { id: 'activity', name: t`Activity`, panel: <V4ActivityPanel /> },
-      { id: 'about', name: t`About`, panel: <></> },
+      { id: 'about', name: t`About`, panel: <V4AboutPanel /> },
       {
         id: 'cycle_payouts',
         name: t`Cycles & Payouts`,