import * as StoreReview from 'expo-store-review';
import * as React from 'react';
import { View, ScrollView } from 'react-native';

import { Text } from '@/components/nativewindui/Text';

export default function RatingsIndicatorScreen() {
  const hasRequestedReviewRef = React.useRef(false);
  React.useEffect(() => {
    async function showRequestReview() {
      if (hasRequestedReviewRef.current) return;
      try {
        if (await StoreReview.hasAction()) {
          await StoreReview.requestReview();
        }
      } catch (error) {
        console.log(
          'FOR ANDROID: Make sure you meet all conditions to be able to test and use it: https://developer.android.com/guide/playcore/in-app-review/test#troubleshooting',
          error
        );
      } finally {
        hasRequestedReviewRef.current = true;
      }
    }
    const timeout = setTimeout(() => {
      showRequestReview();
    }, 1000);

    return () => {
      clearTimeout(timeout);
    };
  }, []);

  return (
    <ScrollView contentInsetAdjustmentBehavior="automatic" className="p-4">
      <View className="border-border bg-card gap-4 rounded-lg border p-4">
        <View className="gap-3">
          <Text className="text-foreground pb-2 text-center font-semibold">
            Please follow the guidelines.
          </Text>
          <View className="flex-row">
            <Text variant="footnote" className="text-muted-foreground w-6 text-center">
              ·
            </Text>
            <View className="flex-1">
              <Text variant="footnote" className="text-muted-foreground">
                Don't call StoreReview.requestReview() from a button
              </Text>
            </View>
          </View>
          <View className="flex-row">
            <Text variant="footnote" className="text-muted-foreground w-6 text-center">
              ·
            </Text>
            <View className="flex-1">
              <Text variant="footnote" className="text-muted-foreground">
                Don't request a review when the user is doing something time sensitive.
              </Text>
            </View>
          </View>
          <View className="flex-row">
            <Text variant="footnote" className="text-muted-foreground w-6 text-center">
              ·
            </Text>
            <View className="flex-1">
              <Text variant="footnote" className="text-muted-foreground">
                Don't ask the user any questions before or while presenting the rating button or
                card.
              </Text>
            </View>
          </View>
          <View className="flex-row">
            <Text variant="footnote" className="text-muted-foreground w-6 text-center">
              ·
            </Text>
            <View className="flex-1">
              <Text variant="footnote" className="text-muted-foreground">
                Each platform has its own quotas, rules, and guidelines, which can vary depending on
                the environment (e.g. development, internal testing, TestFlight, etc.).
              </Text>
            </View>
          </View>
        </View>
      </View>
    </ScrollView>
  );
}