diff options
Diffstat (limited to 'src/view/com/modals')
| -rw-r--r-- | src/view/com/modals/EmbedConsent.tsx | 154 | ||||
| -rw-r--r-- | src/view/com/modals/Modal.tsx | 4 | ||||
| -rw-r--r-- | src/view/com/modals/Modal.web.tsx | 39 |
3 files changed, 18 insertions, 179 deletions
diff --git a/src/view/com/modals/EmbedConsent.tsx b/src/view/com/modals/EmbedConsent.tsx deleted file mode 100644 index 941944728..000000000 --- a/src/view/com/modals/EmbedConsent.tsx +++ /dev/null @@ -1,154 +0,0 @@ -import React from 'react' -import {StyleSheet, TouchableOpacity, View} from 'react-native' -import {LinearGradient} from 'expo-linear-gradient' -import {msg, Trans} from '@lingui/macro' -import {useLingui} from '@lingui/react' - -import {useWebMediaQueries} from '#/lib/hooks/useWebMediaQueries' -import { - EmbedPlayerSource, - embedPlayerSources, - externalEmbedLabels, -} from '#/lib/strings/embed-player' -import {useModalControls} from '#/state/modals' -import {useSetExternalEmbedPref} from '#/state/preferences/external-embeds-prefs' -import {usePalette} from 'lib/hooks/usePalette' -import {colors, gradients, s} from 'lib/styles' -import {Text} from '../util/text/Text' -import {ScrollView} from './util' - -export const snapPoints = [450] - -export function Component({ - onAccept, - source, -}: { - onAccept: () => void - source: EmbedPlayerSource -}) { - const pal = usePalette('default') - const {closeModal} = useModalControls() - const {_} = useLingui() - const setExternalEmbedPref = useSetExternalEmbedPref() - const {isMobile} = useWebMediaQueries() - - const onShowAllPress = React.useCallback(() => { - for (const key of embedPlayerSources) { - setExternalEmbedPref(key, 'show') - } - onAccept() - closeModal() - }, [closeModal, onAccept, setExternalEmbedPref]) - - const onShowPress = React.useCallback(() => { - setExternalEmbedPref(source, 'show') - onAccept() - closeModal() - }, [closeModal, onAccept, setExternalEmbedPref, source]) - - const onHidePress = React.useCallback(() => { - setExternalEmbedPref(source, 'hide') - closeModal() - }, [closeModal, setExternalEmbedPref, source]) - - return ( - <ScrollView - testID="embedConsentModal" - style={[ - s.flex1, - pal.view, - isMobile - ? {paddingHorizontal: 20, paddingTop: 10} - : {paddingHorizontal: 30}, - ]}> - <Text style={[pal.text, styles.title]}> - <Trans>External Media</Trans> - </Text> - - <Text style={pal.text}> - <Trans> - This content is hosted by {externalEmbedLabels[source]}. Do you want - to enable external media? - </Trans> - </Text> - <View style={[s.mt10]} /> - <Text style={pal.textLight}> - <Trans> - 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. - </Trans> - </Text> - <View style={[s.mt20]} /> - <TouchableOpacity - testID="enableAllBtn" - onPress={onShowAllPress} - accessibilityRole="button" - accessibilityLabel={_( - msg`Show embeds from ${externalEmbedLabels[source]}`, - )} - accessibilityHint="" - onAccessibilityEscape={closeModal}> - <LinearGradient - colors={[gradients.blueLight.start, gradients.blueLight.end]} - start={{x: 0, y: 0}} - end={{x: 1, y: 1}} - style={[styles.btn]}> - <Text style={[s.white, s.bold, s.f18]}> - <Trans>Enable External Media</Trans> - </Text> - </LinearGradient> - </TouchableOpacity> - <View style={[s.mt10]} /> - <TouchableOpacity - testID="enableSourceBtn" - onPress={onShowPress} - accessibilityRole="button" - accessibilityLabel={_( - msg`Never load embeds from ${externalEmbedLabels[source]}`, - )} - accessibilityHint="" - onAccessibilityEscape={closeModal}> - <View style={[styles.btn, pal.btn]}> - <Text style={[pal.text, s.bold, s.f18]}> - <Trans>Enable {externalEmbedLabels[source]} only</Trans> - </Text> - </View> - </TouchableOpacity> - <View style={[s.mt10]} /> - <TouchableOpacity - testID="disableSourceBtn" - onPress={onHidePress} - accessibilityRole="button" - accessibilityLabel={_( - msg`Never load embeds from ${externalEmbedLabels[source]}`, - )} - accessibilityHint="" - onAccessibilityEscape={closeModal}> - <View style={[styles.btn, pal.btn]}> - <Text style={[pal.text, s.bold, s.f18]}> - <Trans>No thanks</Trans> - </Text> - </View> - </TouchableOpacity> - </ScrollView> - ) -} - -const styles = StyleSheet.create({ - title: { - textAlign: 'center', - fontWeight: 'bold', - fontSize: 24, - marginBottom: 12, - }, - btn: { - flexDirection: 'row', - alignItems: 'center', - justifyContent: 'center', - width: '100%', - borderRadius: 32, - padding: 14, - backgroundColor: colors.gray1, - }, -}) diff --git a/src/view/com/modals/Modal.tsx b/src/view/com/modals/Modal.tsx index 85ffccf12..652481301 100644 --- a/src/view/com/modals/Modal.tsx +++ b/src/view/com/modals/Modal.tsx @@ -15,7 +15,6 @@ import * as ChangePasswordModal from './ChangePassword' import * as CreateOrEditListModal from './CreateOrEditList' import * as DeleteAccountModal from './DeleteAccount' import * as EditProfileModal from './EditProfile' -import * as EmbedConsentModal from './EmbedConsent' import * as InAppBrowserConsentModal from './InAppBrowserConsent' import * as InviteCodesModal from './InviteCodes' import * as ContentLanguagesSettingsModal from './lang-settings/ContentLanguagesSettings' @@ -116,9 +115,6 @@ export function ModalsContainer() { } else if (activeModal?.name === 'link-warning') { snapPoints = LinkWarningModal.snapPoints element = <LinkWarningModal.Component {...activeModal} /> - } else if (activeModal?.name === 'embed-consent') { - snapPoints = EmbedConsentModal.snapPoints - element = <EmbedConsentModal.Component {...activeModal} /> } else if (activeModal?.name === 'in-app-browser-consent') { snapPoints = InAppBrowserConsentModal.snapPoints element = <InAppBrowserConsentModal.Component {...activeModal} /> diff --git a/src/view/com/modals/Modal.web.tsx b/src/view/com/modals/Modal.web.tsx index 7e5d548ac..f95c74811 100644 --- a/src/view/com/modals/Modal.web.tsx +++ b/src/view/com/modals/Modal.web.tsx @@ -1,33 +1,32 @@ import React from 'react' -import {TouchableWithoutFeedback, StyleSheet, View} from 'react-native' +import {StyleSheet, TouchableWithoutFeedback, View} from 'react-native' import Animated, {FadeIn, FadeOut} from 'react-native-reanimated' -import {usePalette} from 'lib/hooks/usePalette' -import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' -import {useWebBodyScrollLock} from '#/lib/hooks/useWebBodyScrollLock' -import {useModals, useModalControls} from '#/state/modals' +import {useWebBodyScrollLock} from '#/lib/hooks/useWebBodyScrollLock' import type {Modal as ModalIface} from '#/state/modals' -import * as EditProfileModal from './EditProfile' +import {useModalControls, useModals} from '#/state/modals' +import {usePalette} from 'lib/hooks/usePalette' +import {useWebMediaQueries} from 'lib/hooks/useWebMediaQueries' +import * as AddAppPassword from './AddAppPasswords' +import * as AltTextImageModal from './AltImage' +import * as ChangeEmailModal from './ChangeEmail' +import * as ChangeHandleModal from './ChangeHandle' +import * as ChangePasswordModal from './ChangePassword' import * as CreateOrEditListModal from './CreateOrEditList' -import * as UserAddRemoveLists from './UserAddRemoveLists' -import * as ListAddUserModal from './ListAddRemoveUsers' -import * as DeleteAccountModal from './DeleteAccount' -import * as RepostModal from './Repost' -import * as SelfLabelModal from './SelfLabel' -import * as ThreadgateModal from './Threadgate' import * as CropImageModal from './crop-image/CropImage.web' -import * as AltTextImageModal from './AltImage' +import * as DeleteAccountModal from './DeleteAccount' import * as EditImageModal from './EditImage' -import * as ChangeHandleModal from './ChangeHandle' +import * as EditProfileModal from './EditProfile' import * as InviteCodesModal from './InviteCodes' -import * as AddAppPassword from './AddAppPasswords' import * as ContentLanguagesSettingsModal from './lang-settings/ContentLanguagesSettings' import * as PostLanguagesSettingsModal from './lang-settings/PostLanguagesSettings' -import * as VerifyEmailModal from './VerifyEmail' -import * as ChangeEmailModal from './ChangeEmail' -import * as ChangePasswordModal from './ChangePassword' import * as LinkWarningModal from './LinkWarning' -import * as EmbedConsentModal from './EmbedConsent' +import * as ListAddUserModal from './ListAddRemoveUsers' +import * as RepostModal from './Repost' +import * as SelfLabelModal from './SelfLabel' +import * as ThreadgateModal from './Threadgate' +import * as UserAddRemoveLists from './UserAddRemoveLists' +import * as VerifyEmailModal from './VerifyEmail' export function ModalsContainer() { const {isModalActive, activeModals} = useModals() @@ -112,8 +111,6 @@ function Modal({modal}: {modal: ModalIface}) { element = <ChangePasswordModal.Component /> } else if (modal.name === 'link-warning') { element = <LinkWarningModal.Component {...modal} /> - } else if (modal.name === 'embed-consent') { - element = <EmbedConsentModal.Component {...modal} /> } else { return null } |