From c97be22854f641a619f3d7781f64ca00ec73a899 Mon Sep 17 00:00:00 2001
From: Rishabh <zrishabhgarg@gmail.com>
Date: Mon, 28 Jun 2021 15:36:35 +0530
Subject: [PATCH] Added segmented post access setting to labs menu

refs https://github.com/TryGhost/Team/issues/801

- adds the renewed product specific post access setting to new labs post settings sidebar
---
 .../components/gh-post-settings-menu-labs.hbs | 43 ++++++++++++++++---
 .../components/gh-post-settings-menu-labs.js  | 17 ++++++++
 2 files changed, 55 insertions(+), 5 deletions(-)

diff --git a/ghost/admin/app/components/gh-post-settings-menu-labs.hbs b/ghost/admin/app/components/gh-post-settings-menu-labs.hbs
index e8f48206a8..efd446283c 100644
--- a/ghost/admin/app/components/gh-post-settings-menu-labs.hbs
+++ b/ghost/admin/app/components/gh-post-settings-menu-labs.hbs
@@ -80,10 +80,43 @@
 
 
                 {{#if this.showVisibilityInput}}
-                    <div class="form-group">
-                        <label for="visibility-input">Post access</label>
-                        <GhPsmVisibilityInput @post={{this.post}} @triggerId="visibility-input" />
-                    </div>
+                    {{#if (feature "multipleProducts")}}
+                        <GhFormGroup @errors={{this.post.errors}} @hasValidated={{this.post.hasValidated}} @property="visibility">
+                            <label for="visibility-input">Post access</label>
+                            <div
+                                class="gh-radio {{if this.post.isPublic "active"}}"
+                                {{on "click" (action "setVisibility" "public")}}
+                            >
+                                <div class="gh-radio-button"></div>
+                                <div class="gh-radio-content">
+                                    <div class="gh-radio-label">Public</div>
+                                </div>
+                            </div>
+                            <div
+                                class="gh-radio {{if (not this.post.isPublic) "active"}}"
+                                {{on "click" (action "setVisibility" this.post.visibilitySegment)}}
+                            >
+                                <div class="gh-radio-button"></div>
+                                <div class="gh-radio-content">
+                                    <div class="gh-radio-label">Members-only</div>
+                                    <div class="gh-radio-desc">
+                                        <GhMembersSegmentSelect
+                                            @segment={{this.post.visibilitySegment}}
+                                            @onChange={{action "setVisibility"}}
+                                            @renderInPlace={{true}}
+                                            @hideOptionsWhenAllSelected={{true}}
+                                        />
+                                    </div>
+                                </div>
+                            </div>
+                            <GhErrorMessage @errors={{this.post.errors}} @property="visibility" class="no-selection" data-test-error="visibility" />
+                        </GhFormGroup>
+                    {{else}}
+                        <div class="form-group">
+                            <label for="visibility-input">Post access</label>
+                            <GhPsmVisibilityInput @post={{this.post}} @triggerId="visibility-input" />
+                        </div>
+                    {{/if}}
                 {{/if}}
 
 
@@ -439,4 +472,4 @@
         </div>
         {{/if}}
     </div>
-</div>
\ No newline at end of file
+</div>
diff --git a/ghost/admin/app/components/gh-post-settings-menu-labs.js b/ghost/admin/app/components/gh-post-settings-menu-labs.js
index 055555c9cf..07ce9689a5 100644
--- a/ghost/admin/app/components/gh-post-settings-menu-labs.js
+++ b/ghost/admin/app/components/gh-post-settings-menu-labs.js
@@ -146,6 +146,23 @@ export default Component.extend({
                 });
         },
 
+        async setVisibility(segment) {
+            this.post.set('visibility', segment);
+            try {
+                await this.post.validate({property: 'visibility'});
+                if (this.post.changedAttributes().visibility) {
+                    await this.savePostTask.perform();
+                }
+            } catch (e) {
+                if (!e) {
+                    // validation error
+                    return;
+                }
+
+                throw e;
+            }
+        },
+
         setPublishedAtBlogDate(date) {
             let post = this.post;
             let dateString = moment(date).format('YYYY-MM-DD');