diff --git a/__tests__/lib/string.test.ts b/__tests__/lib/string.test.ts
index c59c8b3e34..7a20a49a4e 100644
--- a/__tests__/lib/string.test.ts
+++ b/__tests__/lib/string.test.ts
@@ -437,6 +437,13 @@ describe('parseEmbedPlayerFromUrl', () => {
'https://www.flickr.com/groups/898944@N23/',
'https://www.flickr.com/groups',
+
+ 'https://maxblansjaar.bandcamp.com/album/false-comforts',
+ 'https://grmnygrmny.bandcamp.com/track/fluid',
+ 'https://sufjanstevens.bandcamp.com/',
+ 'https://sufjanstevens.bandcamp.com',
+ 'https://bandcamp.com/',
+ 'https://bandcamp.com',
]
const outputs = [
@@ -815,6 +822,23 @@ describe('parseEmbedPlayerFromUrl', () => {
undefined,
undefined,
+
+ {
+ type: 'bandcamp_album',
+ source: 'bandcamp',
+ playerUri:
+ 'https://bandcamp.com/EmbeddedPlayer/url=https%3A%2F%2Fmaxblansjaar.bandcamp.com%2Falbum%2Ffalse-comforts/size=large/bgcol=ffffff/linkcol=0687f5/minimal=true/transparent=true/',
+ },
+ {
+ type: 'bandcamp_track',
+ source: 'bandcamp',
+ playerUri:
+ 'https://bandcamp.com/EmbeddedPlayer/url=https%3A%2F%2Fgrmnygrmny.bandcamp.com%2Ftrack%2Ffluid/size=large/bgcol=ffffff/linkcol=0687f5/minimal=true/transparent=true/',
+ },
+ undefined,
+ undefined,
+ undefined,
+ undefined,
]
it('correctly grabs the correct id from uri', () => {
diff --git a/src/components/dialogs/EmbedConsent.tsx b/src/components/dialogs/EmbedConsent.tsx
index a9d96be533..7ffba6f3a7 100644
--- a/src/components/dialogs/EmbedConsent.tsx
+++ b/src/components/dialogs/EmbedConsent.tsx
@@ -9,7 +9,8 @@ import {
externalEmbedLabels,
} from '#/lib/strings/embed-player'
import {useSetExternalEmbedPref} from '#/state/preferences'
-import {atoms as a, useBreakpoints, useTheme} from '#/alf'
+import {atoms as a, web} from '#/alf'
+import {Admonition} from '#/components/Admonition'
import {Button, ButtonText} from '#/components/Button'
import * as Dialog from '#/components/Dialog'
import {Text} from '#/components/Typography'
@@ -24,9 +25,7 @@ export function EmbedConsentDialog({
onAccept: () => void
}) {
const {_} = useLingui()
- const t = useTheme()
const setExternalEmbedPref = useSetExternalEmbedPref()
- const {gtMobile} = useBreakpoints()
const onShowAllPress = useCallback(() => {
for (const key of embedPlayerSources) {
@@ -52,50 +51,46 @@ export function EmbedConsentDialog({
+ style={web({maxWidth: 400})}>
-
+
External Media
-
+
This content is hosted by {externalEmbedLabels[source]}. Do you
want to enable external media?
-
+
External media may allow websites to collect information about
you and your device. No information is sent or requested until
you press the "play" button.
-
+