fix: user policy typo

[steven-yn]

시점 이동 줄이기 (https://frontend-fundamentals.com/code/examples/user-policy.html) 내용을 읽다가 예제 코드에 누락된 부분이 있는것 같습니다.

'조건을 한 눈에 볼 수 있는 객체로 만들기' 문단에서 리팩터링된 예제 코드중,
policy 객체의 프로퍼티 admin 과 viewer 에 액세스 하기위한 코드를 추가했습니다

[vercel]

@steven-yn is attempting to deploy a commit to the Toss Team on Vercel.

A member of the Team first needs to authorize it.

[Seol-JY]

How about updating the English version too? (en/code/examples/user-policy.md)

[Seol-JY]

I'd like to suggest a correction regarding the disabled prop in code. Currently, it directly uses the permission values, but this creates an inverted logic:

function Page() {
  const user = useUser();
  const policy = {
    admin: { canInvite: true, canRead: true },
    viewer: { canInvite: false, canRead: true },
  };
  const userPolicy = policy[user.role];

  return (
    <div>
      {/* Current: Button is disabled when permission is true */}
      <Button disabled={userPolicy.canInvite}>Invite</Button>
      <Button disabled={userPolicy.canRead}>Read</Button>

      {/* Should be: Button is disabled when permission is false */}
      <Button disabled={!userPolicy.canInvite}>Invite</Button>
      <Button disabled={!userPolicy.canRead}>Read</Button>
    </div>
  );
}

[karinajjang]

how about this?

function Page() {
  const user = useUser();
  const policy = {
    admin: { canInvite: true, canRead: true },
    viewer: { canInvite: false, canRead: true },
  }[user.role];

  return (
    <div>
      <Button disabled={policy.canInvite}>Invite</Button>
      <Button disabled={policy.canRead}>Read</Button>
    </div>
  );
}

[Seol-JY]

I think this issue is caused by this. #58

[steven-yn]

I think both of you are right, so I changed below

function Page() {
  const user = useUser();
  const policy = {
    admin: { canInvite: true, canRead: true },
    viewer: { canInvite: false, canRead: true },
  }[user.role];

  return (
    <div>
      <Button disabled={!policy.canInvite}>Invite</Button>
      <Button disabled={!policy.canRead}>Read</Button>
    </div>
  );
}

thanks @karinajjang @Seol-JY

[milooy]

💯