From db56cd86cddfec67336b6a6b988a6b79995da368 Mon Sep 17 00:00:00 2001 From: Michael Peter Date: Fri, 18 Aug 2023 15:40:42 -0400 Subject: [PATCH 1/3] Fix TimeAgo component on testnet (#192) --- replacements.dev.json | 3 ++- replacements.mainnet.json | 3 ++- replacements.testnet.json | 3 ++- src/AccountProfile.jsx | 2 +- src/Comments/Comment.jsx | 2 +- src/ComponentCard.jsx | 2 +- src/ComponentDetailsPage.jsx | 2 +- src/Flagged/Feed.jsx | 2 +- src/LatestFollowActivity.jsx | 2 +- src/LatestNews.jsx | 2 +- src/NestedDiscussions/Preview.jsx | 2 +- src/Notification.jsx | 2 +- src/Onboarding/ComponentCard.jsx | 2 +- src/Posts/Post.jsx | 2 +- src/Search/AccountProfile.jsx | 2 +- src/v1/Posts/Post.jsx | 2 +- 16 files changed, 19 insertions(+), 16 deletions(-) diff --git a/replacements.dev.json b/replacements.dev.json index b7b328fb..4a1d329e 100644 --- a/replacements.dev.json +++ b/replacements.dev.json @@ -6,5 +6,6 @@ "REPL_NEAR_URL": "test.near.org", "REPL_NEARWEEK": "discom-dev.testnet", "REPL_QUERYAPI_FEED": "discom-dev.testnet/widget/Posts", - "REPL_FEATURED_COMP_MANAGER": "discom.testnet" + "REPL_FEATURED_COMP_MANAGER": "discom.testnet", + "REPL_TIME_AGO_VERSION": "" } diff --git a/replacements.mainnet.json b/replacements.mainnet.json index e04dcde5..48074251 100644 --- a/replacements.mainnet.json +++ b/replacements.mainnet.json @@ -6,5 +6,6 @@ "REPL_NEAR_URL": "near.org", "REPL_NEARWEEK": "nearweekapp.near", "REPL_QUERYAPI_FEED": "dataplatform.near/widget/QueryApi.Feed", - "REPL_FEATURED_COMP_MANAGER": "bosfeaturedmanager.near" + "REPL_FEATURED_COMP_MANAGER": "bosfeaturedmanager.near", + "REPL_TIME_AGO_VERSION": "@97556750" } diff --git a/replacements.testnet.json b/replacements.testnet.json index ed160383..b5bf46cd 100644 --- a/replacements.testnet.json +++ b/replacements.testnet.json @@ -6,5 +6,6 @@ "REPL_NEAR_URL": "test.near.org", "REPL_NEARWEEK": "discom-dev.testnet", "REPL_QUERYAPI_FEED": "discom.testnet/widget/Posts", - "REPL_FEATURED_COMP_MANAGER": "discom.testnet" + "REPL_FEATURED_COMP_MANAGER": "discom.testnet", + "REPL_TIME_AGO_VERSION": "" } diff --git a/src/AccountProfile.jsx b/src/AccountProfile.jsx index 9d009d75..ea6f5873 100644 --- a/src/AccountProfile.jsx +++ b/src/AccountProfile.jsx @@ -94,7 +94,7 @@ const AccountProfile = ( Joined{" "} {" "} ago diff --git a/src/Comments/Comment.jsx b/src/Comments/Comment.jsx index f950fc49..afbc6933 100644 --- a/src/Comments/Comment.jsx +++ b/src/Comments/Comment.jsx @@ -159,7 +159,7 @@ return ( ) : ( {" "} ago diff --git a/src/ComponentCard.jsx b/src/ComponentCard.jsx index 4962db9a..6b1ae9a7 100644 --- a/src/ComponentCard.jsx +++ b/src/ComponentCard.jsx @@ -152,7 +152,7 @@ return ( {" "} Last updated {" "} ago. diff --git a/src/Flagged/Feed.jsx b/src/Flagged/Feed.jsx index 64e168f3..26ae794e 100644 --- a/src/Flagged/Feed.jsx +++ b/src/Flagged/Feed.jsx @@ -59,7 +59,7 @@ const renderItem = (a) => {
diff --git a/src/LatestFollowActivity.jsx b/src/LatestFollowActivity.jsx index 731de558..eb965fd0 100644 --- a/src/LatestFollowActivity.jsx +++ b/src/LatestFollowActivity.jsx @@ -67,7 +67,7 @@ return (
diff --git a/src/LatestNews.jsx b/src/LatestNews.jsx index d00af758..9b1e2dc7 100644 --- a/src/LatestNews.jsx +++ b/src/LatestNews.jsx @@ -127,7 +127,7 @@ return ( {" "} ago diff --git a/src/NestedDiscussions/Preview.jsx b/src/NestedDiscussions/Preview.jsx index 468ba245..8256fc7f 100644 --- a/src/NestedDiscussions/Preview.jsx +++ b/src/NestedDiscussions/Preview.jsx @@ -126,7 +126,7 @@ return ( ･ {" "} ago diff --git a/src/Notification.jsx b/src/Notification.jsx index 59ef05bc..c98b5cdb 100644 --- a/src/Notification.jsx +++ b/src/Notification.jsx @@ -176,7 +176,7 @@ return ( {notificationMessage[type]} ago diff --git a/src/Onboarding/ComponentCard.jsx b/src/Onboarding/ComponentCard.jsx index a8764f20..e6f3a5d7 100644 --- a/src/Onboarding/ComponentCard.jsx +++ b/src/Onboarding/ComponentCard.jsx @@ -63,7 +63,7 @@ return ( {" "} ago diff --git a/src/Search/AccountProfile.jsx b/src/Search/AccountProfile.jsx index 7210055b..13d1f921 100644 --- a/src/Search/AccountProfile.jsx +++ b/src/Search/AccountProfile.jsx @@ -99,7 +99,7 @@ const AccountProfile = ( Joined{" "} {" "} ago diff --git a/src/v1/Posts/Post.jsx b/src/v1/Posts/Post.jsx index 939b23e3..b355869a 100644 --- a/src/v1/Posts/Post.jsx +++ b/src/v1/Posts/Post.jsx @@ -112,7 +112,7 @@ return ( ) : ( <> {" "} ago From 3246491beb30a2dc4c6087c986cccc88e34dd337 Mon Sep 17 00:00:00 2001 From: Dmitriy <34593263+shelegdmitriy@users.noreply.github.com> Date: Mon, 21 Aug 2023 10:22:25 +0300 Subject: [PATCH 2/3] Implement DIG.Dialog (#191) --- src/DIG/Dialog.jsx | 173 +++++++++++++++++++++++++++++++++++ src/DIG/Dialog.metadata.json | 7 ++ 2 files changed, 180 insertions(+) create mode 100644 src/DIG/Dialog.jsx create mode 100644 src/DIG/Dialog.metadata.json diff --git a/src/DIG/Dialog.jsx b/src/DIG/Dialog.jsx new file mode 100644 index 00000000..6a5d29fd --- /dev/null +++ b/src/DIG/Dialog.jsx @@ -0,0 +1,173 @@ +let { + type, + title, + description, + onCancel, + onConfirm, + cancelButtonText, + confirmButtonText, + cancelButton, + confirmButton, + ...forwardedProps +} = props; + +type = type ?? "dialog"; + +if (["alert", "dialog"].indexOf(type) < 0) { + return "Unsupported type of component. `type` could be only 'alert' or 'dialog'"; +} + +const variant = type === "alert" ? "AlertDialog" : "Dialog"; + +const Root = styled(`${variant}.Root`)``; + +const Overlay = styled(`${variant}.Overlay`)` + background-color: var(--blackA3); + position: fixed; + inset: 0; + animation: overlayShow 150ms cubic-bezier(0.16, 1, 0.3, 1); + + @keyframes overlayShow { + from { + opacity: 0; + } + to { + opacity: 1; + } + } +`; + +const Content = styled(`${variant}.Content`)` + background-color: white; + border-radius: 6px; + box-shadow: 0px 4px 8px 0px var(--blackA3), 0px 0px 0px 1px var(--blackA4); + position: fixed; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + width: 90vw; + max-width: 409px; + max-height: 85vh; + padding: 24px; + animation: contentShow 150ms cubic-bezier(0.16, 1, 0.3, 1); + + @keyframes contentShow { + from { + opacity: 0; + transform: translate(-50%, -48%) scale(0.96); + } + to { + opacity: 1; + transform: translate(-50%, -50%) scale(1); + } + } +`; + +const Title = styled(`${variant}.Title`)` + font: var(--text-base); + font-weight: 700; + color: var(--sand12); +`; + +const Description = styled(`${variant}.Description`)` + font: var(--text-s); + color: var(--sand11); +`; + +const ActionWrapper = styled.div` + display: flex; + gap: 12px; + justify-content: flex-end; +`; + +const Close = styled.button` + all: unset; + font-family: inherit; + border-radius: 100%; + height: 25px; + width: 25px; + display: inline-flex; + align-items: center; + justify-content: center; + color: var(--violet11); + position: absolute; + top: 10px; + right: 10px; + transition: all 200ms; + cursor: pointer; + border: 1px solid transparent; + + &:hover { + border-color: var(--violet6); + color: var(--violet8); + } + + &:focus-within { + box-shadow: 0 0 0 4px var(--violet4); + } +`; + +cancelButton = cancelButton ?? ( + +); + +confirmButton = confirmButton ?? ( + +); + +return ( + + {type === "alert" ? ( + {trigger} + ) : ( + {trigger} + )} + + + {title && {title}} + {description && {description}} + + {type === "alert" ? ( + {} : onCancel} + > + {cancelButton} + + ) : ( + {} : onConfirm}> + {confirmButton} + + )} + + {type === "alert" && ( + {} : onConfirm} + > + {confirmButton} + + )} + + {type === "dialog" && ( + + + + + + )} + + +); diff --git a/src/DIG/Dialog.metadata.json b/src/DIG/Dialog.metadata.json new file mode 100644 index 00000000..ca8c0f23 --- /dev/null +++ b/src/DIG/Dialog.metadata.json @@ -0,0 +1,7 @@ +{ + "description": "This Dialog is built with the Radix primitive: https://www.radix-ui.com/primitives/docs/components/dialog\n\nExample:\n\n```jsx\n\n```\n\n### Props\n\n`type`\n\n- type: `string` (variants: `\"alert\"` or `\"dialog\"`)\n- `\"alert\"` - https://www.radix-ui.com/primitives/docs/components/alert-dialog\n- `\"dialog\"` - https://www.radix-ui.com/primitives/docs/components/dialog\n- Defines type of Dialog.\n\n`title`\n\n- type: `string`\n- Title of Dialog.\n\n`description`\n\n- type: `string`\n- Description of Dialog.\n\n`onCancel`\n\n- type: `function`\n- Event handler called when the user clicks on cancel button.\n\n`cancelButtonText`\n\n- type: `string`\n- Label on cancel button.\n\n`onConfirm`\n\n- type: `function`\n- Event handler called when the user clicks on confirm button.\n\n`confirmButtonText`\n\n- type: `string`\n- Label on confirm button.\n\n`cancelButton`\n\n- type: `JSX`\n- A custom button that closes the dialog.\n- Overrides `cancelButtonText`.\n- _note:_ pass `onCancel` event handler to specify custom action on cancel.\n\n`confirmButton`\n\n- type: `JSX`\n- A custom button that closes the dialog.\n- Overrides `confirmButtonText`.\n- _note:_ pass `onConfirm` event handler to specify custom action on cancel.\n\nThis component also accepts all `Alert.Dialog` or `Dialog` (depends on selected `type`) props as outlined in the Radix documentation.", + "name": "DIG.Dialog", + "tags": { + "dig": "" + } +} From 7c953a7507ad2fdbd05da8eba2cefecf15aaf035 Mon Sep 17 00:00:00 2001 From: Dmitriy <34593263+shelegdmitriy@users.noreply.github.com> Date: Mon, 21 Aug 2023 18:27:57 +0300 Subject: [PATCH 3/3] Fix DIG.Dialog action click (#193) --- src/DIG/Dialog.jsx | 21 +++++++++------------ 1 file changed, 9 insertions(+), 12 deletions(-) diff --git a/src/DIG/Dialog.jsx b/src/DIG/Dialog.jsx index 6a5d29fd..e7bf8f19 100644 --- a/src/DIG/Dialog.jsx +++ b/src/DIG/Dialog.jsx @@ -26,6 +26,7 @@ const Overlay = styled(`${variant}.Overlay`)` position: fixed; inset: 0; animation: overlayShow 150ms cubic-bezier(0.16, 1, 0.3, 1); + z-index: 2147483648; @keyframes overlayShow { from { @@ -113,6 +114,7 @@ cancelButton = cancelButton ?? ( props={{ label: cancelButtonText ?? "Cancel", variant: "secondary", + onClick: onCancel, }} /> ); @@ -123,6 +125,7 @@ confirmButton = confirmButton ?? ( props={{ label: confirmButtonText ?? "Confirm", variant: "primary", + onClick: onConfirm, }} /> ); @@ -140,24 +143,18 @@ return ( {description && {description}} {type === "alert" ? ( - {} : onCancel} - > - {cancelButton} + +
{cancelButton}
 ) : ( - {} : onConfirm}> - {confirmButton} + +
{confirmButton}
 )} {type === "alert" && ( - {} : onConfirm} - > - {confirmButton} + +
{confirmButton}
 )}