From edf26e69c16854d028c402aa9e983a758ff939ed Mon Sep 17 00:00:00 2001
From: Adam Goth <adamgoth@gmail.com>
Date: Wed, 3 Nov 2021 14:16:45 +0100
Subject: [PATCH] Add hat badge to exec detail

---
 lib/hooks/index.ts                            |  2 --
 modules/executive/components/VoteModal.tsx    |  4 ++-
 .../executive}/hooks/useAllSlates.ts          |  0
 {lib => modules/executive}/hooks/useHat.ts    |  0
 modules/home/components/ExecutiveCard.tsx     |  4 +--
 pages/executive.tsx                           |  3 +-
 pages/executive/[proposal-id].tsx             | 31 ++++++++++++++++++-
 pages/index.tsx                               |  2 +-
 8 files changed, 38 insertions(+), 8 deletions(-)
 rename {lib => modules/executive}/hooks/useAllSlates.ts (100%)
 rename {lib => modules/executive}/hooks/useHat.ts (100%)

diff --git a/lib/hooks/index.ts b/lib/hooks/index.ts
index abb0b14ce..c5feed8d2 100644
--- a/lib/hooks/index.ts
+++ b/lib/hooks/index.ts
@@ -2,7 +2,5 @@ export * from './useMkrBalance';
 export * from './useTokenAllowance';
 export * from './useMkrDelegated';
 export * from './useLockedMkr';
-export * from './useHat';
-export * from './useAllSlates';
 export * from './useAllUserVotes';
 export * from './useDelegateAddressMap';
diff --git a/modules/executive/components/VoteModal.tsx b/modules/executive/components/VoteModal.tsx
index 7c91c6061..87b0173b0 100644
--- a/modules/executive/components/VoteModal.tsx
+++ b/modules/executive/components/VoteModal.tsx
@@ -25,7 +25,9 @@ import getMaker, { getNetwork, personalSign } from 'lib/maker';
 import { fadeIn, slideUp } from 'lib/keyframes';
 import { getEtherscanLink, sortBytesArray } from 'lib/utils';
 import { fetchJson } from 'lib/fetchJson';
-import { useLockedMkr, useHat, useAllSlates } from 'lib/hooks';
+import { useLockedMkr } from 'lib/hooks';
+import { useHat } from 'modules/executive/hooks/useHat';
+import { useAllSlates } from 'modules/executive/hooks/useAllSlates';
 import useAccountsStore from 'stores/accounts';
 import useTransactionStore, { transactionsApi, transactionsSelectors } from 'stores/transactions';
 import { TXMined } from 'types/transaction';
diff --git a/lib/hooks/useAllSlates.ts b/modules/executive/hooks/useAllSlates.ts
similarity index 100%
rename from lib/hooks/useAllSlates.ts
rename to modules/executive/hooks/useAllSlates.ts
diff --git a/lib/hooks/useHat.ts b/modules/executive/hooks/useHat.ts
similarity index 100%
rename from lib/hooks/useHat.ts
rename to modules/executive/hooks/useHat.ts
diff --git a/modules/home/components/ExecutiveCard.tsx b/modules/home/components/ExecutiveCard.tsx
index dfb179418..6ba3430f5 100644
--- a/modules/home/components/ExecutiveCard.tsx
+++ b/modules/home/components/ExecutiveCard.tsx
@@ -3,7 +3,7 @@ import Link from 'next/link';
 import useSWR from 'swr';
 import { Button, Text, Flex, Badge, Box, Link as InternalLink, jsx } from 'theme-ui';
 import Skeleton from 'modules/app/components/SkeletonThemed';
-
+import { ZERO_ADDRESS } from 'stores/accounts';
 import Stack from 'modules/app/components/layout/layouts/Stack';
 import getMaker, { getNetwork } from 'lib/maker';
 import { CurrencyObject } from 'types/currency';
@@ -84,7 +84,7 @@ export default function ExecutiveCard({ proposal, isHat, ...props }: Props): JSX
             View proposal
           </Button>
         </Link>
-        {isHat && proposal.address !== '0x0000000000000000000000000000000000000000' ? (
+        {isHat && proposal.address !== ZERO_ADDRESS ? (
           <Badge
             variant="primary"
             sx={{
diff --git a/pages/executive.tsx b/pages/executive.tsx
index 48aaf4005..2c06511f0 100644
--- a/pages/executive.tsx
+++ b/pages/executive.tsx
@@ -12,7 +12,8 @@ import { Icon } from '@makerdao/dai-ui-icons';
 // lib
 import { getExecutiveProposals } from 'modules/executive/api/fetchExecutives';
 import getMaker, { isDefaultNetwork, getNetwork, MKR } from 'lib/maker';
-import { useLockedMkr, useHat } from 'lib/hooks';
+import { useLockedMkr } from 'lib/hooks';
+import { useHat } from 'modules/executive/hooks/useHat';
 import { useVotedProposals } from 'modules/executive/hooks/useVotedProposals';
 import { fetchJson } from 'lib/fetchJson';
 import oldChiefAbi from 'lib/abis/oldChiefAbi.json';
diff --git a/pages/executive/[proposal-id].tsx b/pages/executive/[proposal-id].tsx
index 816a79ffd..322b54b19 100644
--- a/pages/executive/[proposal-id].tsx
+++ b/pages/executive/[proposal-id].tsx
@@ -4,7 +4,19 @@ import { GetStaticProps, GetStaticPaths } from 'next';
 import { useRouter } from 'next/router';
 import ErrorPage from 'next/error';
 import Link from 'next/link';
-import { Button, Card, Flex, Heading, Spinner, Box, Text, Divider, Link as ThemeUILink, jsx } from 'theme-ui';
+import {
+  Badge,
+  Button,
+  Card,
+  Flex,
+  Heading,
+  Spinner,
+  Box,
+  Text,
+  Divider,
+  Link as ThemeUILink,
+  jsx
+} from 'theme-ui';
 import { ethers } from 'ethers';
 import BigNumber from 'bignumber.js';
 import useSWR from 'swr';
@@ -14,6 +26,7 @@ import invariant from 'tiny-invariant';
 import { getExecutiveProposal, getExecutiveProposals } from 'modules/executive/api/fetchExecutives';
 import { useSpellData } from 'modules/executive/hooks/useSpellData';
 import { useVotedProposals } from 'modules/executive/hooks/useVotedProposals';
+import { useHat } from 'modules/executive/hooks/useHat';
 import { useMkrOnHat } from 'modules/executive/hooks/useMkrOnHat';
 import { getNetwork, isDefaultNetwork } from 'lib/maker';
 import { cutMiddle, limitString } from 'lib/string';
@@ -88,6 +101,8 @@ const ProposalView = ({ proposal }: Props): JSX.Element => {
 
   const { data: votedProposals } = useVotedProposals();
   const { data: mkrOnHat } = useMkrOnHat();
+  const { data: hat } = useHat();
+  const isHat = hat && hat.toLowerCase() === proposal.address.toLowerCase();
 
   const { data: comments, error: commentsError } = useSWR(
     `/api/executive/comments/list/${proposal.address}`,
@@ -168,6 +183,20 @@ const ProposalView = ({ proposal }: Props): JSX.Element => {
             <Heading pt={[3, 4]} px={[3, 4]} pb="3" sx={{ fontSize: [5, 6] }}>
               {'title' in proposal ? proposal.title : proposal.address}
             </Heading>
+            {isHat && proposal.address !== ZERO_ADDRESS ? (
+              <Badge
+                variant="primary"
+                sx={{
+                  my: 2,
+                  ml: [3, 4],
+                  borderColor: 'primaryAlt',
+                  color: 'primaryAlt',
+                  textTransform: 'uppercase'
+                }}
+              >
+                Governing proposal
+              </Badge>
+            ) : null}
             <Flex sx={{ mx: [3, 4], mb: 3, justifyContent: 'space-between' }}>
               <StatBox
                 value={
diff --git a/pages/index.tsx b/pages/index.tsx
index 694ff75b1..f473cb2f8 100644
--- a/pages/index.tsx
+++ b/pages/index.tsx
@@ -12,7 +12,7 @@ import { initTestchainPolls } from 'lib/utils';
 import { fetchJson } from 'lib/fetchJson';
 
 import { isActivePoll } from 'modules/polling/helpers/utils';
-import { useHat } from 'lib/hooks';
+import { useHat } from 'modules/executive/hooks/useHat';
 import PrimaryLayout from 'modules/app/components/layout/layouts/Primary';
 import Stack from 'modules/app/components/layout/layouts/Stack';
 import SystemStats from 'modules/home/components/SystemStats';