@umituz/react-native-settings 5.4.9 → 5.4.11

package/src/domains/disclaimer/presentation/components/DisclaimerModal.tsx

@@ -1,103 +0,0 @@
-/**
- * Disclaimer Modal Component
- * Extracted from DisclaimerSetting to follow single responsibility and 200-line rules
- */
-
-import React from 'react';
-import {
-  View,
-  StyleSheet,
-  TouchableOpacity,
-  ScrollView,
-} from 'react-native';
-
-import { AtomicText, AtomicIcon } from '@umituz/react-native-design-system/atoms';
-import { BaseModal } from '@umituz/react-native-design-system/molecules';
-import { useAppDesignTokens } from '@umituz/react-native-design-system/theme';
-
-export interface DisclaimerModalProps {
-  visible: boolean;
-  title: string;
-  content: string;
-  onClose: () => void;
-}
-
-export const DisclaimerModal: React.FC<DisclaimerModalProps> = ({
-  visible,
-  title,
-  content,
-  onClose,
-}) => {
-  const tokens = useAppDesignTokens();
-  const styles = getStyles(tokens);
-
-  return (
-    <BaseModal visible={visible} onClose={onClose}>
-      <View style={styles.modalContentWrapper}>
-        {/* Modal Header */}
-        <View
-          style={[
-            styles.modalHeader,
-            { borderBottomColor: tokens.colors.border },
-          ]}
-        >
-          <AtomicText type="headlineMedium" color="primary">
-            {title}
-          </AtomicText>
-          <TouchableOpacity
-            onPress={onClose}
-            testID="close-disclaimer-modal"
-          >
-            <AtomicIcon name="close" color="primary" size="md" />
-          </TouchableOpacity>
-        </View>
-
-        {/* Scrollable Content */}
-        <ScrollView
-          style={styles.modalContent}
-          contentContainerStyle={styles.modalContentContainer}
-        >
-          <AtomicText
-            type="bodyMedium"
-            color="textPrimary"
-            style={styles.modalText}
-          >
-            {content}
-          </AtomicText>
-        </ScrollView>
-      </View>
-    </BaseModal>
-  );
-};
-
-
-const getStyles = (_tokens: ReturnType<typeof useAppDesignTokens>) =>
-  StyleSheet.create({
-    modalContainer: {
-      flex: 1,
-    },
-    modalContentWrapper: {
-      flex: 1,
-    },
-    modalHeader: {
-      flexDirection: 'row',
-      justifyContent: 'space-between',
-      alignItems: 'center',
-      paddingHorizontal: 20,
-      paddingVertical: 16,
-      borderBottomWidth: 1,
-    },
-
-    modalContent: {
-      flex: 1,
-    },
-
-    modalContentContainer: {
-      padding: 20,
-    },
-
-    modalText: {
-      lineHeight: 24,
-      fontSize: 15, // or tokens.typography.bodyMedium.responsiveFontSize
-    },
-  });

package/src/domains/feedback/presentation/components/FeedbackModal.tsx

@@ -1,99 +0,0 @@
-/**
- * Feedback Modal Component
- * Modal wrapper for providing feedback
- */
-
-import React from "react";
-import { View, StyleSheet, TouchableOpacity } from "react-native";
-import { AtomicText, AtomicIcon } from "@umituz/react-native-design-system/atoms";
-import { ScreenLayout } from "@umituz/react-native-design-system/layouts";
-import { BaseModal } from "@umituz/react-native-design-system/molecules";
-import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
-import { FeedbackForm } from "./FeedbackForm";
-import type { FeedbackType, FeedbackRating } from "../../domain/entities/FeedbackEntity";
-import type { FeedbackFormProps } from "./FeedbackFormProps";
-
-export interface FeedbackModalProps {
-    visible: boolean;
-    onClose: () => void;
-    onSubmit: (data: { type: FeedbackType; rating: FeedbackRating; description: string; title: string }) => Promise<void>;
-    initialType?: FeedbackType;
-    isSubmitting?: boolean;
-    title?: string;
-    subtitle?: string;
-    texts: FeedbackFormProps['texts'];
-}
-
-export const FeedbackModal: React.FC<FeedbackModalProps> = ({
-    visible,
-    onClose,
-    onSubmit,
-    initialType,
-    isSubmitting,
-    title,
-    subtitle,
-    texts,
-}) => {
-    const tokens = useAppDesignTokens();
-    const styles = getStyles(tokens);
-
-    const header = (
-        <View style={styles.header}>
-            <View style={styles.headerText}>
-                {title && <AtomicText style={{ fontSize: 20, fontWeight: '600' }}>{title}</AtomicText>}
-                {subtitle && <AtomicText style={{ fontSize: 14, marginTop: 4 }}>{subtitle}</AtomicText>}
-            </View>
-            <TouchableOpacity
-                onPress={onClose}
-                style={[styles.closeButton, { backgroundColor: tokens.colors.surfaceVariant }]}
-            >
-                <AtomicIcon name="close" size="sm" color="onSurface" />
-            </TouchableOpacity>
-        </View>
-    );
-
-    return (
-        <BaseModal visible={visible} onClose={onClose}>
-            <ScreenLayout
-                header={header}
-                scrollable={true}
-                edges={[]}
-                keyboardAvoiding={true}
-                contentContainerStyle={styles.content}
-                hideScrollIndicator={false}
-            >
-                <FeedbackForm
-                    onSubmit={onSubmit}
-                    initialType={initialType}
-                    isSubmitting={isSubmitting}
-                    texts={texts}
-                />
-            </ScreenLayout>
-        </BaseModal>
-    );
-};
-
-
-const getStyles = (_tokens: ReturnType<typeof useAppDesignTokens>) =>
-  StyleSheet.create({
-    header: {
-        flexDirection: "row",
-        justifyContent: "space-between",
-        alignItems: "center",
-        padding: 16,
-        borderBottomWidth: 1,
-    },
-    headerText: {
-        flex: 1,
-    },
-    closeButton: {
-        width: 36,
-        height: 36,
-        borderRadius: 18,
-        justifyContent: "center",
-        alignItems: "center",
-    },
-    content: {
-        padding: 20,
-    },
-});

package/src/domains/rating/presentation/components/RatingPromptModal.tsx

@@ -1,152 +0,0 @@
-/**
- * Rating Prompt Modal
- * 2-step rating prompt: Custom modal → Native review prompt
- */
-
-import React from "react";
-import { Modal, View, StyleSheet } from "react-native";
-import { AtomicText, AtomicButton, AtomicIcon } from "@umituz/react-native-design-system/atoms";
-import { useResponsive } from "@umituz/react-native-design-system/responsive";
-import { useAppDesignTokens } from "@umituz/react-native-design-system/theme";
-import type { RatingTranslations } from "../../domain/entities/RatingConfig";
-
-export interface RatingPromptModalProps {
-  visible: boolean;
-  onPositive: () => void;
-  onNegative: () => void;
-  onLater: () => void;
-  onDismiss: () => void;
-  translations?: RatingTranslations;
-  appName?: string;
-}
-
-export const RatingPromptModal: React.FC<RatingPromptModalProps> = ({
-  visible,
-  onPositive,
-  onNegative,
-  onLater,
-  onDismiss,
-  translations,
-  appName = "this app",
-}) => {
-  const tokens = useAppDesignTokens();
-  const responsive = useResponsive();
-
-  const defaultTranslations: RatingTranslations = {
-    title: translations?.title ?? "Enjoying the app?",
-    message:
-      translations?.message ??
-      `If you love using ${appName}, would you mind taking a moment to rate it?`,
-    positiveButton: translations?.positiveButton ?? "Yes, I love it!",
-    negativeButton: translations?.negativeButton ?? "Not really",
-    laterButton: translations?.laterButton ?? "Maybe later",
-  };
-
-  return (
-    <Modal
-      visible={visible}
-      transparent
-      animationType="none"
-      onRequestClose={onDismiss}
-      statusBarTranslucent
-    >
-      <View
-        style={[
-          styles.overlay,
-          { backgroundColor: "rgba(0, 0, 0, 0.5)" },
-        ]}
-      >
-        <View
-          style={[
-            styles.container,
-            {
-              backgroundColor: tokens.colors.surface,
-              borderRadius: tokens.borders.radius.xl,
-              padding: tokens.spacing.lg,
-              maxWidth: responsive.maxContentWidth * 0.85,
-              width: "90%",
-            },
-          ]}
-        >
-          <View style={styles.iconContainer}>
-            <AtomicIcon name="star" size="xl" color="primary" />
-          </View>
-
-          <AtomicText
-            type="headlineMedium"
-            color="onSurface"
-            style={[
-              styles.title,
-              { marginBottom: tokens.spacing.sm },
-            ]}
-          >
-            {defaultTranslations.title}
-          </AtomicText>
-
-          <AtomicText
-            type="bodyMedium"
-            color="onSurfaceVariant"
-            style={[
-              styles.message,
-              { marginBottom: tokens.spacing.lg },
-            ]}
-          >
-            {defaultTranslations.message}
-          </AtomicText>
-
-          <View style={[styles.buttonContainer, { gap: tokens.spacing.sm }]}>
-            <AtomicButton
-              variant="primary"
-              onPress={onPositive}
-              style={styles.button}
-            >
-              {defaultTranslations.positiveButton}
-            </AtomicButton>
-
-            <AtomicButton
-              variant="outline"
-              onPress={onNegative}
-              style={styles.button}
-            >
-              {defaultTranslations.negativeButton}
-            </AtomicButton>
-
-            <AtomicButton
-              variant="text"
-              onPress={onLater}
-              style={styles.button}
-            >
-              {defaultTranslations.laterButton}
-            </AtomicButton>
-          </View>
-        </View>
-      </View>
-    </Modal>
-  );
-};
-
-const styles = StyleSheet.create({
-  overlay: {
-    flex: 1,
-    justifyContent: "center",
-    alignItems: "center",
-  },
-  container: {
-    alignItems: "center",
-  },
-  iconContainer: {
-    marginBottom: 16,
-  },
-  title: {
-    textAlign: "center",
-  },
-  message: {
-    textAlign: "center",
-  },
-  buttonContainer: {
-    width: "100%",
-  },
-  button: {
-    width: "100%",
-  },
-});