From 05e209c59ea44f61d79ae72fdb198665a07da284 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Florian=20Qu=C3=A8ze?= <florian@queze.net>
Date: Thu, 7 Aug 2025 19:30:45 +0200
Subject: [PATCH] A new permalink should be generated and shown after using the
 re-upload feature.

---
 src/components/app/MenuButtons/Permalink.js   |  2 +-
 .../shared/ButtonWithPanel/index.js           | 15 ++++++++---
 src/test/components/ButtonWithPanel.test.js   |  4 +--
 .../components/MenuButtonsPermalinks.test.js  | 27 +++++++++++++++++++
 4 files changed, 41 insertions(+), 7 deletions(-)

diff --git a/src/components/app/MenuButtons/Permalink.js b/src/components/app/MenuButtons/Permalink.js
index b3f19db089..21dd3ebc68 100644
--- a/src/components/app/MenuButtons/Permalink.js
+++ b/src/components/app/MenuButtons/Permalink.js
@@ -78,7 +78,7 @@ export class MenuButtonsPermalink extends React.PureComponent<Props, State> {
         <ButtonWithPanel
           buttonClassName="menuButtonsButton menuButtonsButton-hasIcon menuButtonsPermalinkButtonButton"
           label="Permalink"
-          initialOpen={this.props.isNewlyPublished}
+          open={this.props.isNewlyPublished}
           onPanelOpen={this._shortenUrlAndFocusTextFieldOnCompletion}
           onPanelClose={this._onPermalinkPanelClose}
           panelClassName="menuButtonsPermalinkPanel"
diff --git a/src/components/shared/ButtonWithPanel/index.js b/src/components/shared/ButtonWithPanel/index.js
index 1ca5e8d386..0104a24473 100644
--- a/src/components/shared/ButtonWithPanel/index.js
+++ b/src/components/shared/ButtonWithPanel/index.js
@@ -36,9 +36,8 @@ type Props = {|
   +label: string,
   +panelContent: React.Node,
   +panelClassName?: string,
-  // This prop tells the panel to be open by default, but the open/close state is fully
-  // managed by the ButtonWithPanel component.
-  +initialOpen?: boolean,
+  // Setting this prop to true opens the panel.
+  +open?: boolean,
   // The class name of the button input element.
   +buttonClassName?: string,
   +onPanelOpen?: () => mixed,
@@ -57,7 +56,7 @@ export class ButtonWithPanel extends React.PureComponent<Props, State> {
 
   constructor(props: Props) {
     super(props);
-    this.state = { open: !!props.initialOpen };
+    this.state = { open: !!props.open };
   }
 
   componentDidMount() {
@@ -70,6 +69,14 @@ export class ButtonWithPanel extends React.PureComponent<Props, State> {
     }
   }
 
+  componentDidUpdate(prevProps: Props) {
+    // Open the panel when the open prop becomes true.
+    if (!prevProps.open && this.props.open) {
+      this.setState({ open: true });
+      this.openPanel();
+    }
+  }
+
   componentWillUnmount() {
     window.removeEventListener('keydown', this._onKeyDown);
     window.removeEventListener('click', this._onWindowClick);
diff --git a/src/test/components/ButtonWithPanel.test.js b/src/test/components/ButtonWithPanel.test.js
index 1407817a07..bbd6d09f81 100644
--- a/src/test/components/ButtonWithPanel.test.js
+++ b/src/test/components/ButtonWithPanel.test.js
@@ -44,7 +44,7 @@ describe('shared/ButtonWithPanel', () => {
       <ButtonWithPanel
         className="button"
         label="My Button"
-        initialOpen={true}
+        open={true}
         panelClassName="panel"
         panelContent={<div>Panel content</div>}
       />
@@ -73,7 +73,7 @@ describe('shared/ButtonWithPanel', () => {
         <ButtonWithPanel
           className="button"
           label="My Button"
-          initialOpen={true}
+          open={true}
           panelContent={<div data-testid="panel-content">Panel content</div>}
         />
       );
diff --git a/src/test/components/MenuButtonsPermalinks.test.js b/src/test/components/MenuButtonsPermalinks.test.js
index 3681303ae7..70bbabfb68 100644
--- a/src/test/components/MenuButtonsPermalinks.test.js
+++ b/src/test/components/MenuButtonsPermalinks.test.js
@@ -88,4 +88,31 @@ describe('<Permalink>', function () {
     );
     expect(input).toHaveValue(shortUrl);
   });
+
+  it('opens the permalink panel when isNewlyPublished changes to true', async function () {
+    const { dispatch, queryInput, shortUrl, shortUrlPromise } = setup();
+
+    // Initially the panel should not be open
+    expect(queryInput()).toBeFalsy();
+
+    // Simulate a profile being published/re-uploaded by dispatching PROFILE_PUBLISHED
+    act(() => {
+      dispatch({
+        type: 'PROFILE_PUBLISHED',
+        hash: 'newhash',
+        profileName: 'test',
+        prePublishedState: null,
+      });
+    });
+
+    // Wait for the async operations to complete
+    await act(() => shortUrlPromise);
+
+    // The input should now be visible, indicating the panel opened automatically
+    const input = ensureExists(
+      queryInput(),
+      'Expected the permalink panel to open automatically after publishing'
+    );
+    expect(input).toHaveValue(shortUrl);
+  });
 });