diff --git a/superset-frontend/src/explore/components/controls/DatasourceControl/index.tsx b/superset-frontend/src/explore/components/controls/DatasourceControl/index.tsx
index 512795b2d3e..fee5548936d 100644
--- a/superset-frontend/src/explore/components/controls/DatasourceControl/index.tsx
+++ b/superset-frontend/src/explore/components/controls/DatasourceControl/index.tsx
@@ -40,6 +40,7 @@ import {
   DatasourceModal,
   ErrorAlert,
 } from 'src/components';
+import SemanticViewEditModal from 'src/features/semanticViews/SemanticViewEditModal';
 import { Menu } from '@superset-ui/core/components/Menu';
 import { Icons } from '@superset-ui/core/components/Icons';
 import WarningIconWithTooltip from '@superset-ui/core/components/WarningIconWithTooltip';
@@ -69,6 +70,7 @@ interface ExtendedDatasource extends Datasource {
   }>;
   extra?: string;
   health_check_message?: string;
+  cache_timeout?: number | null;
   database?: {
     id: number;
     database_name: string;
@@ -591,14 +593,31 @@ class DatasourceControl extends PureComponent<
             )}
           </div>
         )}
-        {showEditDatasourceModal && (
-          <DatasourceModal
-            datasource={datasource}
-            show={showEditDatasourceModal}
-            onDatasourceSave={this.onDatasourceSave}
-            onHide={this.toggleEditDatasourceModal}
-          />
-        )}
+        {showEditDatasourceModal &&
+          (datasource.type === DatasourceType.SemanticView ? (
+            <SemanticViewEditModal
+              show={showEditDatasourceModal}
+              onHide={this.toggleEditDatasourceModal}
+              onSave={() => {
+                if (this.props.onDatasourceSave) {
+                  this.props.onDatasourceSave(datasource);
+                }
+              }}
+              semanticView={{
+                id: datasource.id,
+                table_name: datasource.name,
+                description: datasource.description,
+                cache_timeout: datasource.cache_timeout,
+              }}
+            />
+          ) : (
+            <DatasourceModal
+              datasource={datasource}
+              show={showEditDatasourceModal}
+              onDatasourceSave={this.onDatasourceSave}
+              onHide={this.toggleEditDatasourceModal}
+            />
+          ))}
         {showChangeDatasourceModal && (
           <ChangeDatasourceModal
             onDatasourceSave={this.onDatasourceSave}
diff --git a/superset-frontend/src/features/semanticViews/SemanticViewEditModal.tsx b/superset-frontend/src/features/semanticViews/SemanticViewEditModal.tsx
index 0a08331dff1..680c08ec4e9 100644
--- a/superset-frontend/src/features/semanticViews/SemanticViewEditModal.tsx
+++ b/superset-frontend/src/features/semanticViews/SemanticViewEditModal.tsx
@@ -36,8 +36,8 @@ interface SemanticViewEditModalProps {
   show: boolean;
   onHide: () => void;
   onSave: () => void;
-  addDangerToast: (msg: string) => void;
-  addSuccessToast: (msg: string) => void;
+  addDangerToast?: (msg: string) => void;
+  addSuccessToast?: (msg: string) => void;
   semanticView: {
     id: number;
     table_name: string;
@@ -50,8 +50,8 @@ export default function SemanticViewEditModal({
   show,
   onHide,
   onSave,
-  addDangerToast,
-  addSuccessToast,
+  addDangerToast = () => {},
+  addSuccessToast = () => {},
   semanticView,
 }: SemanticViewEditModalProps) {
   const [description, setDescription] = useState<string>('');