diff --git a/app/components/shared/Badge.js b/app/components/shared/Badge.js
index f7f1a2e873fa848a66930d08347af8dc5dbe08f4..29e9cc2a5aa02a7180571370a45ca0a09dd78ff6 100644
--- a/app/components/shared/Badge.js
+++ b/app/components/shared/Badge.js
@@ -59,6 +59,8 @@ const label = status => {
     rejected: 'Rejected',
     submitted: 'Submitted',
     revise: 'Revising',
+    invited: 'Invited', // reviewer status
+    completed: 'Completed', // reviewer status
   }
   return labels[status] || `Unknown (${status})`
 }
diff --git a/app/components/shared/General.js b/app/components/shared/General.js
index f0e4551f704bd66c0477c4f42440388f3a786604..dc6ca58eda32534b3085339d92de8c3087f12d11 100644
--- a/app/components/shared/General.js
+++ b/app/components/shared/General.js
@@ -59,3 +59,22 @@ export const SectionAction = styled.div`
   grid-column: 3;
   justify-self: end;
 `
+
+const Page = styled.div`
+  padding: ${grid(2)};
+`
+
+const Heading = styled.div`
+  color: ${th('colorPrimary')};
+  font-family: ${th('fontReading')};
+  font-size: ${th('fontSizeHeading3')};
+  line-height: ${th('lineHeightHeading3')};
+`
+
+export { Page, Heading }
+
+export const HeadingWithAction = styled.div`
+  display: grid;
+  grid-template-columns: 1fr auto;
+  align-items: center;
+`
diff --git a/app/components/shared/Select.js b/app/components/shared/Select.js
new file mode 100644
index 0000000000000000000000000000000000000000..a28127cd67ccd28d927b969f02d2d4cc51d97fb8
--- /dev/null
+++ b/app/components/shared/Select.js
@@ -0,0 +1,42 @@
+import React, { useContext } from 'react'
+import ReactSelect from 'react-select'
+import { ThemeContext } from 'styled-components'
+
+const styles = th => ({
+  menu: (provided, state) => ({
+    ...provided,
+    borderRadius: th.borderRadius,
+  }),
+
+  control: (provided, state) => ({
+    ...provided,
+    border: state.isFocused
+      ? `1px solid ${th.colorPrimary}`
+      : `1px solid ${th.colorBorder}`,
+    boxShadow: state.isFocused ? `0 0 0 1px ${th.colorPrimary}` : 'none',
+    borderRadius: th.borderRadius,
+    '&:hover': {
+      boxShadow: `0 0 0 1px ${th.colorPrimary}`,
+    },
+    minHeight: `calc(${th.gridUnit} * 5)`,
+  }),
+
+  singleValue: (provided, state) => {
+    const opacity = state.isDisabled ? 0.5 : 1
+    const transition = 'opacity 300ms'
+
+    return { ...provided, opacity, transition }
+  },
+
+  option: (provided, state) => ({
+    ...provided,
+    backgroundColor:
+      state.isFocused || state.isSelected ? th.colorFurniture : 'white',
+    color: th.colorText,
+  }),
+})
+
+export const Select = props => {
+  const theme = useContext(ThemeContext)
+  return <ReactSelect {...props} styles={styles(theme)} />
+}
diff --git a/app/components/shared/index.js b/app/components/shared/index.js
index 7ac615184caed50bd15b8b63e77bb5142ce2515f..9c03d0839662980df9d89035eb141a227f8a089b 100644
--- a/app/components/shared/index.js
+++ b/app/components/shared/index.js
@@ -7,3 +7,4 @@ export * from './UserCombo'
 export * from './Table'
 export * from './General'
 export * from './Badge'
+export * from './Select'