Display citizen's hungriness

Author: mfcochauxlaberge

src/generated/graphql.ts

@@ -140,6 +140,7 @@ export type Citizen = {
   name: Scalars['String']['output'];
   skillSet: Array<SkillLevel>;
   stomach: Scalars['Int']['output'];
+  stomachCapacity: Scalars['Int']['output'];
 };
 
 export type CitizenInput = {
@@ -1108,7 +1109,7 @@ export type GetCitizensQueryVariables = Exact<{
 }>;
 
 
-export type GetCitizensQuery = { __typename?: 'Query', citizensFromIsland: { __typename?: 'CitizenList', citizens: Array<{ __typename?: 'Citizen', id: string, bornOn: number, name: string, isHomeless: boolean }> } | { __typename?: 'NotFound' } };
+export type GetCitizensQuery = { __typename?: 'Query', citizensFromIsland: { __typename?: 'CitizenList', citizens: Array<{ __typename?: 'Citizen', id: string, bornOn: number, name: string, isHomeless: boolean, stomach: number, stomachCapacity: number }> } | { __typename?: 'NotFound' } };
 
 export type GetEventsQueryVariables = Exact<{
   input: EventsInput;
@@ -2100,6 +2101,8 @@ export const GetCitizensDocument = gql`
         bornOn
         name
         isHomeless
+        stomach
+        stomachCapacity
       }
     }
   }

src/pages/island/Citizens.tsx

@@ -28,6 +28,8 @@ const CitizensPage = () => {
               bornOn
               name
               isHomeless
+              stomach
+              stomachCapacity
             }
           }
         }
@@ -45,6 +47,8 @@ const CitizensPage = () => {
         bornOn: c.bornOn,
         name: c.name,
         isHomeless: c.isHomeless,
+        stomach: c.stomach,
+        stomachCapacity: c.stomachCapacity,
       });
     }
   }
@@ -91,13 +95,23 @@ const TableStyle = styled.table`
 `;
 
 const CitizenItem: FunctionComponent<{ citizen: citizen }> = ({ citizen }) => {
+  const hungriness = citizen.stomach / citizen.stomachCapacity;
+  const isHungry = hungriness < 0.5 && hungriness >= 0.1;
+  const isStarving = hungriness < 0.1;
+
   return (
     <tr>
       <td>
         <NavLink to={'/citizen/' + citizen.id}>{citizen.name}</NavLink>{' '}
         {citizen.isHomeless && (
           <Label text="Homeless" textColor="#fff" backgroundColor="#b66" />
         )}
+        {isHungry && (
+          <Label text="Hungry" textColor="#fff" backgroundColor="#b66" />
+        )}
+        {isStarving && (
+          <Label text="Starving" textColor="#fff" backgroundColor="#b66" />
+        )}
       </td>
       <td>{DateTime.fromMillis(citizen.bornOn * 1000).toRelative()}</td>
     </tr>
@@ -109,6 +123,8 @@ interface citizen {
   bornOn: number;
   name: string;
   isHomeless: boolean;
+  stomach: number;
+  stomachCapacity: number;
 }
 
 export default CitizensPage;