Hooking up mock backend

jsapp/js/components/header/mainHeader.component.tsx

@@ -157,11 +157,11 @@ const MainHeader = class MainHeader extends React.Component<MainHeaderProps> {
             )}
 
             <HeaderTitleEditor asset={asset} isEditable={userCanEditAsset} />
-
-            <OrganizationBadge/>
           </React.Fragment>
         )}
 
+        <OrganizationBadge/>
+
         <AccountMenu />
 
         {!isLoggedIn && this.renderLoginButton()}

jsapp/js/components/header/organizationBadge.component.tsx

@@ -1,8 +1,14 @@
-import React from 'react';
 import styles from './organizationBadge.module.scss';
+import {useOrganizationQuery} from 'jsapp/js/account/stripe.api';
 
 export default function OrganizationBadge() {
-  return (
-    <div className={styles.root}>UNHCR TURKEY</div>
-  );
+  const orgQuery = useOrganizationQuery();
+
+  if (orgQuery.data?.is_mmo) {
+    return (
+      <div className={styles.root}>{orgQuery.data.name.toUpperCase()}</div>
+    );
+  } else {
+    return null;
+  }
 }

jsapp/js/components/header/organizationBadge.module.scss

@@ -6,7 +6,7 @@
   padding: 6px 10px;
   border-radius: 48px;
   font-weight: 600;
-  font-size: 1em;
+  font-size: .85em;
   line-height: 12px;
   margin-right: 20px;
 }