Improve Post component

app/javascript/components/Post/PostP.tsx

@@ -4,6 +4,7 @@ import IPost from '../../interfaces/IPost';
 import IPostStatus from '../../interfaces/IPostStatus';
 
 import PostStatusSelect from './PostStatusSelect';
+import PostStatusLabel from '../shared/PostStatusLabel';
 
 interface Props {
   postId: number;
@@ -39,9 +40,9 @@ class PostP extends React.Component<Props> {
 
     return (
       <div>
-        <h1>{post.title}</h1>
+        <h2>{post.title}</h2>
         {
-          isPowerUser ?
+          isPowerUser && post ?
             <PostStatusSelect
               postStatuses={postStatuses}
               selectedPostStatusId={post.postStatusId}
@@ -50,7 +51,9 @@ class PostP extends React.Component<Props> {
               }
             />
           :
-            <span>LLL</span>
+            <PostStatusLabel
+              {...postStatuses.find(postStatus => postStatus.id === post.postStatusId)}
+            />
         }
 
         <p>{post.description}</p>

app/javascript/components/Post/PostStatusSelect.tsx

@@ -18,7 +18,7 @@ const PostStatusSelect = ({
   handleChange,
 }: Props) => (
   <select
-    value={selectedPostStatusId || ''}
+    value={selectedPostStatusId || 'none'}
     onChange={
       (e: FormEvent) => (
         handleChange(parseInt((e.target as HTMLSelectElement).value))
@@ -30,7 +30,7 @@ const PostStatusSelect = ({
         {postStatus.name}
       </option>
     ))}
-    <option>None</option>
+    <option value="none">None</option>
   </select>
 );