import {useCallback} from 'react'
import {ScrollView} from 'react-native'
import * as Layout from '#/components/Layout'
import {useSetTitle} from '#/lib/hooks/useSetTitle'
import {atoms as a, useTheme} from '#/alf'
import {Text} from '#/components/Typography'

export function TermsOfServiceScreen() {
  useSetTitle('Terms of Service')
  const t = useTheme()

  return (
    <Layout.Screen>
      <ScrollView
        style={[a.flex_1, {backgroundColor: t.palette.white}]}
        contentContainerStyle={[a.p_lg, a.pt_5xl, a.pb_5xl]}>
        <Text style={[a.text_2xl, a.font_bold, a.mb_lg]}>Terms of Service</Text>

        <Text style={[a.text_lg, a.font_bold, a.mt_lg, a.mb_md]}>Acceptance</Text>
        <Text style={[a.mb_md]}>
          By using syu.is, you agree to these terms. If you do not agree, please do not use the service.
        </Text>

        <Text style={[a.text_lg, a.font_bold, a.mt_lg, a.mb_md]}>Prohibited Content</Text>
        <Text style={[a.mb_md]}>
          Do not post illegal content, spam, or harass others. Do not impersonate others or spread misinformation.
        </Text>

        <Text style={[a.text_lg, a.font_bold, a.mt_lg, a.mb_md]}>Account Termination</Text>
        <Text style={[a.mb_md]}>
          The administrator reserves the right to suspend or terminate accounts that violate these terms.
        </Text>

        <Text style={[a.text_lg, a.font_bold, a.mt_lg, a.mb_md]}>Disclaimer</Text>
        <Text style={[a.mb_md]}>
          This service is provided "as is" without warranty of any kind.
        </Text>

        <Text style={[a.text_lg, a.font_bold, a.mt_xl, a.mb_md]}>日本語</Text>
        <Text style={[a.mb_md]}>
          syu.isを利用することで、これらの利用規約に同意したものとみなします。違法なコンテンツの投稿、スパム、他者への嫌がらせは禁止です。管理者は規約違反のアカウントを停止する権利を有します。本サービスは現状のまま提供され、いかなる保証もありません。
        </Text>

        <Text style={[a.text_sm, a.mt_xl, {color: t.palette.contrast_500}]}>
          Last updated: 2026
        </Text>
      </ScrollView>
    </Layout.Screen>
  )
}