1#@!#!123s

ALWAYS HENGHENG888 1#@!#!123s
: / var / www / chinawholesale-frontend-next / src / components / pages / dashboard /
Filename : AccountComponent.js
back
'use client'
import React, { useState } from 'react'
import { useCustomer } from '@/api/auth'
import ProfileUpdate from './includes/ProfileUpdate'
import PageCardComponent from '@/components/mixed/PageCardComponent'
import ExpressButton from '@/components/buttons/ExpressButton'
import NextImage from '@/components/mixed/NextImage'

export default function AccountComponent() {
    const [edit, setEdit] = useState(false)

    const { user: customer, userIsLoading } = useCustomer()

    return (
        <>
            <ProfileUpdate customer={customer} edit={edit} setEdit={setEdit} />
            <div className={'max-w-[768px] mx-auto'}>
                <PageCardComponent
                    title={'My Profile'}
                    isLoading={userIsLoading}
                >
                    {
                        !!customer?.email &&
                        <div className="page-content">
                            <table className="table">
                                <tbody>
                                <tr>
                                    <td />
                                    <td>
                                        {customer?.avatar_type === 'gravatar' ? (
                                            <NextImage
                                                src={`https://www.gravatar.com/avatar/404`}
                                                className={'w-[4rem] h-[4rem]'}
                                                alt={customer?.name || ''}
                                            />
                                        ) : (
                                            <NextImage
                                                src={customer?.avatar_type}
                                                className={'w-[4rem] h-[4rem]'}
                                                alt={customer?.name || ''}
                                            />
                                        )}
                                    </td>
                                </tr>

                                <tr>
                                    <td>Name:</td>
                                    <td>{customer.name}</td>
                                </tr>
                                <tr>
                                    <td>Phone:</td>
                                    <td>{customer.phone || 'Add Phone'}</td>
                                </tr>
                                <tr>
                                    <td>Email:</td>
                                    <td>{customer.email}</td>
                                </tr>
                                </tbody>
                            </table>
                            <div className={'mt-4'}>
                                <ExpressButton
                                    type="twitter"
                                    onClick={() => setEdit(true)}
                                    label={'Edit Profile'}
                                />
                            </div>
                        </div>
                    }
                </PageCardComponent>
            </div>
        </>
    )
}