import { getPageStyle } from '@/utils/page-style'
import { View, Text, Image } from '@tarojs/components'
import { useEffect, useState } from 'react'
import Taro, { useRouter } from '@tarojs/taro'
import { getToken } from '@/services/auth'
import { resolveWechatMpNotificationLink } from '@/services/notification'
import { usePageShare } from '@/utils/page-share'
import './index.scss'

function buildQuery(params: Record<string, string | number | null | undefined>): string {
  return Object.entries(params)
    .filter(([, value]) => value !== undefined && value !== null && String(value) !== '')
    .map(([key, value]) => `${encodeURIComponent(key)}=${encodeURIComponent(String(value))}`)
    .join('&')
}

function buildCurrentPageUrl(token: string): string {
  return `/pages/notification/index?token=${encodeURIComponent(token)}`
}

export default function NotificationEntry() {
  usePageShare()
  const router = useRouter()
  const token = String(router.params.token || '').trim()
  const [message, setMessage] = useState('正在打开留言...')

  useEffect(() => {
    const openNotification = async () => {
      if (!token) {
        setMessage('通知链接无效')
        return
      }

      if (!getToken()) {
        Taro.setStorageSync('postLoginRedirect', buildCurrentPageUrl(token))
        Taro.reLaunch({ url: '/pages/login/index' })
        return
      }

      try {
        const result = await resolveWechatMpNotificationLink(token)
        const query = buildQuery(result.params || {})
        const route = result.route.startsWith('/') ? result.route : `/${result.route}`
        Taro.redirectTo({ url: query ? `${route}?${query}` : route })
      } catch (error: any) {
        console.error('[notification] resolve failed:', error)
        setMessage(error?.message || '通知链接已失效')
      }
    }

    void openNotification()
  }, [token])

  return (
    <View className='notification-page' style={getPageStyle(false)}>
      <Image className='notification-mascot' src={require('../../assets/ui/dog-question.png')} mode='aspectFit' />
      <View className='notification-panel'>
        <Text className='notification-title'>伴伴</Text>
        <Text className='notification-message'>{message}</Text>
      </View>
    </View>
  )
}