import { useLocaleContext } from '@arcblock/ux/lib/Locale/context';
import { FormInput } from '@blocklet/payment-react';
import { useFormContext, useWatch } from 'react-hook-form';
import { Alert, Typography } from '@mui/material';

export default function GooglePlayMethodForm({ checkDisabled }: { checkDisabled: (key: string) => boolean }) {
  const { t } = useLocaleContext();
  const { control } = useFormContext();
  const serviceAccountJson = useWatch({ control, name: 'settings.google_play.service_account_json' }) as
    | string
    | undefined;

  // Quick client-side JSON sanity check — the server re-validates and decrypts.
  let parseError: string | null = null;
  let clientEmail: string | null = null;
  if (serviceAccountJson) {
    try {
      const parsed = JSON.parse(serviceAccountJson);
      if (!parsed.client_email || !parsed.private_key) {
        parseError = t('admin.paymentMethod.google_play.service_account_json.missingFields');
      } else {
        clientEmail = parsed.client_email;
      }
    } catch {
      parseError = t('admin.paymentMethod.google_play.service_account_json.invalidJson');
    }
  }

  return (
    <>
      <FormInput
        name="name"
        type="text"
        rules={{ required: true }}
        label={t('admin.paymentMethod.name.label')}
        placeholder={t('admin.paymentMethod.name.tip')}
        disabled={checkDisabled('name')}
        inputProps={{ maxLength: 32 }}
      />
      <FormInput
        name="description"
        type="text"
        rules={{ required: true }}
        label={t('admin.paymentMethod.description.label')}
        placeholder={t('admin.paymentMethod.description.tip')}
        inputProps={{ maxLength: 255 }}
      />
      <FormInput
        name="settings.google_play.package_name"
        type="text"
        rules={{ required: true }}
        label={t('admin.paymentMethod.google_play.package_name.label')}
        placeholder={t('admin.paymentMethod.google_play.package_name.tip')}
        disabled={checkDisabled('settings.google_play.package_name')}
      />
      <FormInput
        name="settings.google_play.service_account_json"
        type="text"
        multiline
        rows={6}
        rules={{ required: true }}
        label={t('admin.paymentMethod.google_play.service_account_json.label')}
        placeholder={t('admin.paymentMethod.google_play.service_account_json.tip')}
        disabled={checkDisabled('settings.google_play.service_account_json')}
      />
      {parseError && (
        <Alert severity="error" sx={{ mt: -1 }}>
          {parseError}
        </Alert>
      )}
      {clientEmail && (
        <Typography variant="caption" color="text.secondary" sx={{ mt: -1, display: 'block' }}>
          {t('admin.paymentMethod.google_play.service_account_json.detectedClient')}: {clientEmail}
        </Typography>
      )}
      <FormInput
        name="settings.google_play.pubsub_topic_name"
        type="text"
        label={t('admin.paymentMethod.google_play.pubsub_topic_name.label')}
        placeholder={t('admin.paymentMethod.google_play.pubsub_topic_name.tip')}
        disabled={checkDisabled('settings.google_play.pubsub_topic_name')}
      />
    </>
  );
}
