From e4d8f7af6123659c0637f5ce74eeb0a48125e6a3 Mon Sep 17 00:00:00 2001
From: Enzo Martellucci <52219496+EnxDev@users.noreply.github.com>
Date: Thu, 24 Oct 2024 18:31:15 +0200
Subject: [PATCH] refactor: Migration publishedStatus to typescript (#30653)

---
 .../src/dashboard/components/Header/index.jsx |  4 +--
 .../src/dashboard/components/Header/types.ts  |  2 +-
 .../PublishedStatus/PublishedStatus.test.tsx  | 12 ++++----
 .../PublishedStatus/{index.jsx => index.tsx}  | 29 ++++++++++---------
 4 files changed, 24 insertions(+), 23 deletions(-)
 rename superset-frontend/src/dashboard/components/PublishedStatus/{index.jsx => index.tsx} (80%)

diff --git a/superset-frontend/src/dashboard/components/Header/index.jsx b/superset-frontend/src/dashboard/components/Header/index.jsx
index 9afaf5534cae4..9470f875ffd6f 100644
--- a/superset-frontend/src/dashboard/components/Header/index.jsx
+++ b/superset-frontend/src/dashboard/components/Header/index.jsx
@@ -548,8 +548,8 @@ class Header extends PureComponent {
                 dashboardId={dashboardInfo.id}
                 isPublished={isPublished}
                 savePublished={this.props.savePublished}
-                canEdit={userCanEdit}
-                canSave={userCanSaveAs}
+                userCanEdit={userCanEdit}
+                userCanSave={userCanSaveAs}
                 visible={!editMode}
               />
             ),
diff --git a/superset-frontend/src/dashboard/components/Header/types.ts b/superset-frontend/src/dashboard/components/Header/types.ts
index 5407a6025c7e2..caf087404f045 100644
--- a/superset-frontend/src/dashboard/components/Header/types.ts
+++ b/superset-frontend/src/dashboard/components/Header/types.ts
@@ -86,7 +86,7 @@ export interface HeaderProps {
   onSave: () => void;
   fetchFaveStar: () => void;
   saveFaveStar: () => void;
-  savePublished: () => void;
+  savePublished: (dashboardId: number, isPublished: boolean) => void;
   updateDashboardTitle: () => void;
   editMode: boolean;
   setEditMode: () => void;
diff --git a/superset-frontend/src/dashboard/components/PublishedStatus/PublishedStatus.test.tsx b/superset-frontend/src/dashboard/components/PublishedStatus/PublishedStatus.test.tsx
index c0437cee6c9a8..28661317e515b 100644
--- a/superset-frontend/src/dashboard/components/PublishedStatus/PublishedStatus.test.tsx
+++ b/superset-frontend/src/dashboard/components/PublishedStatus/PublishedStatus.test.tsx
@@ -24,8 +24,8 @@ const defaultProps = {
   dashboardId: 1,
   isPublished: false,
   savePublished: jest.fn(),
-  canEdit: false,
-  canSave: false,
+  userCanEdit: false,
+  userCanSave: false,
 };
 
 test('renders with unpublished status and readonly permissions', async () => {
@@ -44,8 +44,8 @@ test('renders with unpublished status and write permissions', async () => {
   render(
     <PublishedStatus
       {...defaultProps}
-      canEdit
-      canSave
+      userCanEdit
+      userCanSave
       savePublished={savePublished}
     />,
   );
@@ -69,8 +69,8 @@ test('renders with published status and write permissions', async () => {
     <PublishedStatus
       {...defaultProps}
       isPublished
-      canEdit
-      canSave
+      userCanEdit
+      userCanSave
       savePublished={savePublished}
     />,
   );
diff --git a/superset-frontend/src/dashboard/components/PublishedStatus/index.jsx b/superset-frontend/src/dashboard/components/PublishedStatus/index.tsx
similarity index 80%
rename from superset-frontend/src/dashboard/components/PublishedStatus/index.jsx
rename to superset-frontend/src/dashboard/components/PublishedStatus/index.tsx
index c96654214614c..3fdb0de11a645 100644
--- a/superset-frontend/src/dashboard/components/PublishedStatus/index.jsx
+++ b/superset-frontend/src/dashboard/components/PublishedStatus/index.tsx
@@ -17,17 +17,17 @@
  * under the License.
  */
 import { Component } from 'react';
-import PropTypes from 'prop-types';
 import { t } from '@superset-ui/core';
 import { Tooltip } from 'src/components/Tooltip';
 import Label from 'src/components/Label';
+import { HeaderProps, HeaderDropdownProps } from '../Header/types';
 
-const propTypes = {
-  dashboardId: PropTypes.number,
-  isPublished: PropTypes.bool.isRequired,
-  savePublished: PropTypes.func.isRequired,
-  canEdit: PropTypes.bool,
-  canSave: PropTypes.bool,
+export type DashboardPublishedStatusType = {
+  dashboardId: HeaderDropdownProps['dashboardId'];
+  userCanEdit: HeaderDropdownProps['userCanEdit'];
+  userCanSave: HeaderDropdownProps['userCanSave'];
+  isPublished: HeaderProps['isPublished'];
+  savePublished: HeaderProps['savePublished'];
 };
 
 const draftButtonTooltip = t(
@@ -44,8 +44,9 @@ const publishedTooltip = t(
   'This dashboard is published. Click to make it a draft.',
 );
 
-export default class PublishedStatus extends Component {
-  componentDidMount() {
+export default class PublishedStatus extends Component<DashboardPublishedStatusType> {
+  constructor(props: DashboardPublishedStatusType) {
+    super(props);
     this.togglePublished = this.togglePublished.bind(this);
   }
 
@@ -54,10 +55,12 @@ export default class PublishedStatus extends Component {
   }
 
   render() {
+    const { isPublished, userCanEdit, userCanSave } = this.props;
+
     // Show everybody the draft badge
-    if (!this.props.isPublished) {
+    if (!isPublished) {
       // if they can edit the dash, make the badge a button
-      if (this.props.canEdit && this.props.canSave) {
+      if (userCanEdit && userCanSave) {
         return (
           <Tooltip
             id="unpublished-dashboard-tooltip"
@@ -86,7 +89,7 @@ export default class PublishedStatus extends Component {
     }
 
     // Show the published badge for the owner of the dashboard to toggle
-    if (this.props.canEdit && this.props.canSave) {
+    if (userCanEdit && userCanSave) {
       return (
         <Tooltip
           id="published-dashboard-tooltip"
@@ -108,5 +111,3 @@ export default class PublishedStatus extends Component {
     return null;
   }
 }
-
-PublishedStatus.propTypes = propTypes;