diff --git a/assets/icons/download_stroke2_corner0_rounded.svg b/assets/icons/download_stroke2_corner0_rounded.svg
new file mode 100644
index 0000000000..899fef3e5e
--- /dev/null
+++ b/assets/icons/download_stroke2_corner0_rounded.svg
@@ -0,0 +1 @@
+
diff --git a/src/components/Dialog/index.tsx b/src/components/Dialog/index.tsx
index 158244c8e9..cdce3765f0 100644
--- a/src/components/Dialog/index.tsx
+++ b/src/components/Dialog/index.tsx
@@ -256,7 +256,7 @@ export const ScrollableInner = React.forwardRef<
borderTopLeftRadius: 40,
borderTopRightRadius: 40,
},
- flatten(style),
+ style,
]}
contentContainerStyle={a.pb_4xl}
ref={ref}>
diff --git a/src/components/dialogs/nudges/TenMillion.tsx b/src/components/dialogs/nudges/TenMillion.tsx
index 2be5e3491c..5aa45f2141 100644
--- a/src/components/dialogs/nudges/TenMillion.tsx
+++ b/src/components/dialogs/nudges/TenMillion.tsx
@@ -7,15 +7,16 @@ import {msg, Trans} from '@lingui/macro'
import {useLingui} from '@lingui/react'
import {getCanvas} from '#/lib/canvas'
+import {shareUrl} from '#/lib/sharing'
import {sanitizeDisplayName} from '#/lib/strings/display-names'
import {sanitizeHandle} from '#/lib/strings/handles'
-import {isNative} from '#/platform/detection'
+import {isAndroid, isNative, isWeb} from '#/platform/detection'
import {useModerationOpts} from '#/state/preferences/moderation-opts'
import {useProfileQuery} from '#/state/queries/profile'
import {useSession} from '#/state/session'
import {useComposerControls} from 'state/shell'
import {formatCount} from '#/view/com/util/numeric/format'
-import {UserAvatar} from '#/view/com/util/UserAvatar'
+// import {UserAvatar} from '#/view/com/util/UserAvatar'
import {Logomark} from '#/view/icons/Logomark'
import {
atoms as a,
@@ -30,6 +31,7 @@ import {useContext} from '#/components/dialogs/nudges'
import {Divider} from '#/components/Divider'
import {GradientFill} from '#/components/GradientFill'
import {ArrowOutOfBox_Stroke2_Corner0_Rounded as Share} from '#/components/icons/ArrowOutOfBox'
+import {Download_Stroke2_Corner0_Rounded as Download} from '#/components/icons/Download'
import {Image_Stroke2_Corner0_Rounded as ImageIcon} from '#/components/icons/Image'
import {Loader} from '#/components/Loader'
import {Text} from '#/components/Typography'
@@ -88,12 +90,9 @@ export function TenMillion() {
const isLoadingData = isProfileLoading || !moderation || !profile
const isLoadingImage = !uri
- const userNumber = 56738 // TODO
+ const userNumber = 10_000_000 // TODO
- const captureInProgress = React.useRef(false)
- const imageRef = React.useRef(null)
-
- const share = () => {
+ const sharePost = () => {
if (uri) {
controls.tenMillion.close(() => {
setTimeout(() => {
@@ -112,15 +111,11 @@ export function TenMillion() {
}
}
- const onCanvasReady = async () => {
- if (
- imageRef.current &&
- imageRef.current.capture &&
- !captureInProgress.current
- ) {
- captureInProgress.current = true
- const uri = await imageRef.current.capture()
- setUri(uri)
+ const onNativeShare = () => {
+ if (uri) {
+ controls.tenMillion.close(() => {
+ shareUrl(uri)
+ })
}
}
@@ -137,6 +132,31 @@ export function TenMillion() {
}
}
+ const imageRef = React.useRef(null)
+ // const captureInProgress = React.useRef(false)
+ // const [cavasRelayout, setCanvasRelayout] = React.useState('key')
+ // const onCanvasReady = async () => {
+ // if (
+ // imageRef.current &&
+ // imageRef.current.capture &&
+ // !captureInProgress.current
+ // ) {
+ // captureInProgress.current = true
+ // setCanvasRelayout('updated')
+ // }
+ // }
+ const onCanvasLayout = async () => {
+ if (
+ imageRef.current &&
+ imageRef.current.capture // &&
+ // cavasRelayout === 'updated'
+ ) {
+ console.log('LAYOUT')
+ const uri = await imageRef.current.capture()
+ setUri(uri)
+ }
+ }
+
const canvas = isLoadingData ? null : (
@@ -208,7 +230,7 @@ export function TenMillion() {
@@ -224,17 +246,7 @@ export function TenMillion() {
{' '}
🎉
-
+
#
- {i18n.number(userNumber)}
-
+
+ {i18n.number(userNumber)}
+
+
{/* End centered content */}
@@ -264,14 +290,16 @@ export function TenMillion() {
},
]}>
+ {/*
+ */}
-
+
{sanitizeDisplayName(
profile.displayName ||
sanitizeHandle(profile.handle),
@@ -283,6 +311,8 @@ export function TenMillion() {
style={[
a.text_sm,
a.font_semibold,
+ ,
+ a.leading_tight,
lightTheme.atoms.text_contrast_medium,
]}>
{sanitizeHandle(profile.handle, '@')}
@@ -293,11 +323,16 @@ export function TenMillion() {
style={[
a.text_sm,
a.font_semibold,
+ ,
+ a.leading_tight,
lightTheme.atoms.text_contrast_low,
]}>
- {i18n.date(profile.createdAt, {
- dateStyle: 'long',
- })}
+
+ Joined{' '}
+ {i18n.date(profile.createdAt, {
+ dateStyle: 'long',
+ })}
+
)}
@@ -315,13 +350,12 @@ export function TenMillion() {
return (
-
-
diff --git a/src/components/icons/Download.tsx b/src/components/icons/Download.tsx
new file mode 100644
index 0000000000..86b4942864
--- /dev/null
+++ b/src/components/icons/Download.tsx
@@ -0,0 +1,5 @@
+import {createSinglePathSVG} from './TEMPLATE'
+
+export const Download_Stroke2_Corner0_Rounded = createSinglePathSVG({
+ path: 'M12 3a1 1 0 0 1 1 1v8.086l1.793-1.793a1 1 0 1 1 1.414 1.414l-3.5 3.5a1 1 0 0 1-1.414 0l-3.5-3.5a1 1 0 1 1 1.414-1.414L11 12.086V4a1 1 0 0 1 1-1ZM4 14a1 1 0 0 1 1 1v4h14v-4a1 1 0 1 1 2 0v5a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1v-5a1 1 0 0 1 1-1Z',
+})