ms314006

const useCheckUserPermission = () => {
  const { refetch: fetchUserProfile } = useUserProfile(userId);
  const userProfile = await fetchUserProfile();

  const userPermissionHandler = new UserPermissionHandler(userProfile);

  const guards = new Guards();
  guard.addGuards([
    { isValid: userPermissionHandler.isLogin },
    { isValid: userPermissionHandler.isMobileVerified },

ms314006

// 取得資料
const { refetch: fetchUserProfile } = useUserProfile(userId);
const userProfile = await fetchUserProfile();

// 建立檢查權限的邏輯
const userPermissionHandler = new UserPermissionHandler(userProfile);

// 將要檢查的權限放到 guards 裡面
const guards = new Guards();
guard.addGuards([

ms314006

class Guards {
  constructor() {
    this.guards = [];
  }

  addGuards(guards) {
    if (Array.isArray(guards)) {
      this.guards = […this.guards, …guards];
    } else {
      throw new Error('guards should be a array');

ms314006

class UserPermissionHandler {
  constructor(user) {
    this.user = (user || {});
  }

  get isLogin() {
    return Boolean(this.user.token);
  }

  get isMobileVerified() {

ms314006

const useUserProfile = (userId) => useQuery({
  queryKey: ['user'],
  queryFn: async () => {
    const userProfile = await fetchUserProfile();
    return new User(userProfile);
  },
});

ms314006

import Transaction from './Transaction';

const getTransactionInfo = (transaction) => new Transaction(transaction);

ms314006

Promise.resolve()
  .then(() => console.log('b'));

setTimeout(() => console.log('a'));

console.log('c');

ms314006

const toUpperCase = (str) => str.toUpperCase();
const getFirstLetter = (str) => str[0] || '';

const getCapitalFirstLetter = (str) => getFirstLetter(toUpperCase(str));

ms314006

const TransactionInfo = (transaction) => (
  <div>
    <label>交易狀態：</label>
    <span>{ transaction.status === 'SUCCESS' ? '成功' : '失敗' }</span>
    <button disabled={transaction.status !== 'SUCCESS'}>
      退款
    </button>
  </div>
);

ms314006

const TransactionInfo = (transaction) => {
  const getTransactionInfo = () => {
    if (transaction.status === 'SUCCESS') {
      return {
        statusString: '成功',
        isNonRefundable: false,
      };
    }
    return {
      statusString: '失敗',