Add the refresh button to sync the state

ui/src/views/repoDeploy/index.tsx

@@ -2,7 +2,7 @@ import { useEffect, useState } from 'react';
 import { shallowEqual } from 'react-redux';
 import { useParams } from 'react-router-dom';
 import { PageHeader, Result, Button } from 'antd';
-
+import { RedoOutlined } from '@ant-design/icons';
 import { useAppSelector, useAppDispatch } from '../../redux/hooks';
 import {
   DeploymentType,
@@ -48,10 +48,13 @@ export default (): JSX.Element => {
     envs,
     env,
     currentDeployment,
+    branch,
     branches,
     branchStatuses,
+    commit,
     commits,
     commitStatuses,
+    tag,
     tags,
     tagStatuses,
     deploying,
@@ -73,6 +76,24 @@ export default (): JSX.Element => {
     // eslint-disable-next-line
   }, [dispatch]);
 
+  const onClickRefresh = () => {
+    dispatch(fetchTags());
+    if (tag) {
+      dispatch(checkTag());
+    }
+
+    dispatch(fetchBranches());
+    if (branch) {
+      dispatch(checkBranch());
+      // Fetch commits only when a branch is selected.
+      dispatch(fetchCommits());
+    }
+
+    if (commit) {
+      dispatch(checkCommit());
+    }
+  };
+
   const onSelectEnv = (env: Env) => {
     dispatch(actions.setEnv(env));
     dispatch(fetchCurrentDeploymentOfEnv(env));
@@ -150,6 +171,7 @@ export default (): JSX.Element => {
   }
   return (
     <RepoDeploy
+      onClickRefresh={onClickRefresh}
       envs={envs}
       onSelectEnv={onSelectEnv}
       onChangeType={onChangeType}
@@ -178,9 +200,11 @@ interface RepoDeployProps
   extends DeployFormProps,
     Omit<DynamicPayloadModalProps, 'visible' | 'env' | 'onClickCancel'> {
   env?: Env;
+  onClickRefresh(): void;
 }
 
 function RepoDeploy({
+  onClickRefresh,
   // Properities for the DeployForm component.
   envs,
   onSelectEnv,
@@ -226,7 +250,19 @@ function RepoDeploy({
   return (
     <div>
       <div>
-        <PageHeader title="Deploy" />
+        <PageHeader
+          title="Deploy"
+          extra={[
+            <Button
+              key="1"
+              type="text"
+              shape="circle"
+              size="large"
+              icon={<RedoOutlined />}
+              onClick={onClickRefresh}
+            />,
+          ]}
+        />
       </div>
       <div style={{ padding: '16px 0px' }}>
         <DeployForm