Spiegel von
https://github.com/paviliondev/discourse-custom-wizard.git
synchronisiert 2024-11-09 11:52:54 +01:00
Update subscription admin ux
Dieser Commit ist enthalten in:
Ursprung
7028471603
Commit
6c6e402153
12 geänderte Dateien mit 50 neuen und 149 gelöschten Zeilen
|
@ -1,3 +1,14 @@
|
||||||
|
<DButton
|
||||||
|
@icon={{this.updateIcon}}
|
||||||
|
@action={{this.update}}
|
||||||
|
class="btn update"
|
||||||
|
@disabled={{this.updating}}
|
||||||
|
@title="admin.wizard.subscription.update.title"
|
||||||
|
>
|
||||||
|
{{#if this.updating}}
|
||||||
|
{{loading-spinner size="small"}}
|
||||||
|
{{/if}}
|
||||||
|
</DButton>
|
||||||
<DButton
|
<DButton
|
||||||
@action={{this.click}}
|
@action={{this.click}}
|
||||||
class="wizard-subscription-badge {{this.subscription.subscriptionType}}"
|
class="wizard-subscription-badge {{this.subscription.subscriptionType}}"
|
||||||
|
@ -5,15 +16,4 @@
|
||||||
>
|
>
|
||||||
{{d-icon "pavilion-logo"}}
|
{{d-icon "pavilion-logo"}}
|
||||||
<span>{{this.label}}</span>
|
<span>{{this.label}}</span>
|
||||||
</DButton>
|
|
||||||
<DButton
|
|
||||||
@icon={{this.updateIcon}}
|
|
||||||
@action={{this.update}}
|
|
||||||
class="btn btn-primary update"
|
|
||||||
@disabled={{this.updating}}
|
|
||||||
@title="admin.wizard.subscription.update.title"
|
|
||||||
>
|
|
||||||
{{#if this.updating}}
|
|
||||||
{{loading-spinner size="small"}}
|
|
||||||
{{/if}}
|
|
||||||
</DButton>
|
</DButton>
|
|
@ -2,7 +2,6 @@ import { inject as service } from "@ember/service";
|
||||||
import { action, computed } from "@ember/object";
|
import { action, computed } from "@ember/object";
|
||||||
import Component from "@glimmer/component";
|
import Component from "@glimmer/component";
|
||||||
import { tracked } from "@glimmer/tracking";
|
import { tracked } from "@glimmer/tracking";
|
||||||
import DiscourseURL from "discourse/lib/url";
|
|
||||||
import I18n from "I18n";
|
import I18n from "I18n";
|
||||||
|
|
||||||
export default class WizardSubscriptionBadge extends Component {
|
export default class WizardSubscriptionBadge extends Component {
|
||||||
|
@ -32,7 +31,7 @@ export default class WizardSubscriptionBadge extends Component {
|
||||||
|
|
||||||
@action
|
@action
|
||||||
click() {
|
click() {
|
||||||
DiscourseURL.routeTo(this.subscription.subscriptionLink);
|
window.open(this.subscription.subscriptionCtaLink, "_blank").focus();
|
||||||
}
|
}
|
||||||
|
|
||||||
@action
|
@action
|
||||||
|
|
|
@ -1,7 +0,0 @@
|
||||||
<DButton
|
|
||||||
@action={{this.click}}
|
|
||||||
class="btn btn-pavilion-support {{this.subscription.subscriptionType}}"
|
|
||||||
@title={{this.title}}
|
|
||||||
@label={{this.label}}
|
|
||||||
@icon={{this.icon}}
|
|
||||||
/>
|
|
|
@ -1,34 +0,0 @@
|
||||||
import { inject as service } from "@ember/service";
|
|
||||||
import { action, computed } from "@ember/object";
|
|
||||||
import Component from "@glimmer/component";
|
|
||||||
|
|
||||||
export default class WizardSubscriptionCta extends Component {
|
|
||||||
@service subscription;
|
|
||||||
|
|
||||||
@computed("subscription.subscribed")
|
|
||||||
get i18nKey() {
|
|
||||||
return `admin.wizard.subscription.cta.${
|
|
||||||
this.subscription.subscribed ? "subscribed" : "none"
|
|
||||||
}`;
|
|
||||||
}
|
|
||||||
|
|
||||||
@computed("subscription.subscribed")
|
|
||||||
get icon() {
|
|
||||||
return this.subscription.subscribed ? "far-life-ring" : "external-link-alt";
|
|
||||||
}
|
|
||||||
|
|
||||||
@computed("i18nKey")
|
|
||||||
get title() {
|
|
||||||
return `${this.i18nKey}.title`;
|
|
||||||
}
|
|
||||||
|
|
||||||
@computed("i18nKey")
|
|
||||||
get label() {
|
|
||||||
return `${this.i18nKey}.label`;
|
|
||||||
}
|
|
||||||
|
|
||||||
@action
|
|
||||||
click() {
|
|
||||||
window.open(this.subscription.subscriptionCtaLink, "_blank").focus();
|
|
||||||
}
|
|
||||||
}
|
|
|
@ -1,4 +1,5 @@
|
||||||
<div class="supplier-authorize">
|
<div class="supplier-authorize">
|
||||||
|
<WizardSubscriptionBadge />
|
||||||
{{#if authorized}}
|
{{#if authorized}}
|
||||||
{{conditional-loading-spinner size="small" condition=unauthorizing}}
|
{{conditional-loading-spinner size="small" condition=unauthorizing}}
|
||||||
<DButton
|
<DButton
|
||||||
|
@ -18,6 +19,4 @@
|
||||||
@action={{this.authorize}}
|
@action={{this.authorize}}
|
||||||
/>
|
/>
|
||||||
{{/if}}
|
{{/if}}
|
||||||
<WizardSubscriptionBadge />
|
|
||||||
<WizardSubscriptionCta />
|
|
||||||
</div>
|
</div>
|
|
@ -7,7 +7,7 @@ const PRODUCT_PAGE = "https://custom-wizard.pavilion.tech";
|
||||||
const SUPPORT_MESSAGE =
|
const SUPPORT_MESSAGE =
|
||||||
"https://coop.pavilion.tech/new-message?username=support&title=Custom%20Wizard%20Support";
|
"https://coop.pavilion.tech/new-message?username=support&title=Custom%20Wizard%20Support";
|
||||||
const MANAGER_CATEGORY =
|
const MANAGER_CATEGORY =
|
||||||
"https://discourse.pluginmanager.org/c/discourse-custom-wizard";
|
"https://coop.pavilion.tech/c/support/discourse-custom-wizard";
|
||||||
|
|
||||||
export default class SubscriptionService extends Service {
|
export default class SubscriptionService extends Service {
|
||||||
@tracked subscribed = false;
|
@tracked subscribed = false;
|
||||||
|
@ -16,7 +16,6 @@ export default class SubscriptionService extends Service {
|
||||||
@tracked communitySubscription = false;
|
@tracked communitySubscription = false;
|
||||||
@tracked standardSubscription = false;
|
@tracked standardSubscription = false;
|
||||||
@tracked subscriptionAttributes = {};
|
@tracked subscriptionAttributes = {};
|
||||||
subscriptionLandingUrl = PRODUCT_PAGE;
|
|
||||||
|
|
||||||
async init() {
|
async init() {
|
||||||
super.init(...arguments);
|
super.init(...arguments);
|
||||||
|
@ -49,10 +48,6 @@ export default class SubscriptionService extends Service {
|
||||||
this.standardSubscription = this.subscriptionType === "standard";
|
this.standardSubscription = this.subscriptionType === "standard";
|
||||||
}
|
}
|
||||||
|
|
||||||
get subscriptionLink() {
|
|
||||||
return this.subscriptionLandingUrl;
|
|
||||||
}
|
|
||||||
|
|
||||||
get subscriptionCtaLink() {
|
get subscriptionCtaLink() {
|
||||||
switch (this.subscriptionType) {
|
switch (this.subscriptionType) {
|
||||||
case "none":
|
case "none":
|
||||||
|
|
|
@ -823,25 +823,6 @@ $error: #ef1700;
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
}
|
}
|
||||||
|
|
||||||
.btn.btn-pavilion-support {
|
|
||||||
background: var(--pavilion-primary);
|
|
||||||
color: var(--pavilion-secondary);
|
|
||||||
|
|
||||||
.d-icon {
|
|
||||||
color: var(--pavilion-secondary);
|
|
||||||
}
|
|
||||||
|
|
||||||
&:hover,
|
|
||||||
&:focus {
|
|
||||||
background: darken($pavilion_primary, 5%);
|
|
||||||
|
|
||||||
&[href],
|
|
||||||
svg.d-icon {
|
|
||||||
color: darken($pavilion_secondary, 10%);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.wizard-subscription-container {
|
.wizard-subscription-container {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
padding: 1em;
|
padding: 1em;
|
||||||
|
@ -877,35 +858,40 @@ $error: #ef1700;
|
||||||
padding: 0.5em 0.65em;
|
padding: 0.5em 0.65em;
|
||||||
background-color: rgba($primary-medium, 0.05);
|
background-color: rgba($primary-medium, 0.05);
|
||||||
border: 1.5px solid rgba($primary-medium, 0.5);
|
border: 1.5px solid rgba($primary-medium, 0.5);
|
||||||
color: $primary-medium;
|
color: var(--secondary);
|
||||||
|
|
||||||
&:hover {
|
svg.d-icon-pavilion-logo {
|
||||||
color: $primary-medium;
|
|
||||||
}
|
|
||||||
|
|
||||||
svg {
|
|
||||||
width: 15px;
|
width: 15px;
|
||||||
height: 15px;
|
height: 15px;
|
||||||
margin-right: 0.45em;
|
margin-right: 0.45em;
|
||||||
margin-bottom: 0.15em;
|
margin-bottom: 0.15em;
|
||||||
|
color: var(--secondary);
|
||||||
|
}
|
||||||
|
|
||||||
|
&.none {
|
||||||
|
background-color: var(--subscription-none);
|
||||||
|
border: 1.5px solid var(--subscription-none);
|
||||||
}
|
}
|
||||||
|
|
||||||
&.standard {
|
&.standard {
|
||||||
background-color: rgba($subscription_standard, 0.05);
|
background-color: var(--subscription-standard);
|
||||||
border: 1.5px solid rgba($subscription_standard, 0.5);
|
border: 1.5px solid var(--subscription-standard);
|
||||||
color: $subscription_standard;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
&.business {
|
&.business {
|
||||||
background-color: $subscription_business;
|
background-color: var(--subscription-business);
|
||||||
border: 1.5px solid $subscription_business;
|
border: 1.5px solid var(--subscription-business);
|
||||||
color: $secondary;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
&.community {
|
&.community {
|
||||||
background-color: $subscription_community;
|
background-color: var(--subscription-community);
|
||||||
border: 1.5px solid $pavilion_primary;
|
border: 1.5px solid var(--pavilion-primary);
|
||||||
color: $pavilion_primary;
|
color: var(--pavilion-primary);
|
||||||
|
|
||||||
|
&:hover,
|
||||||
|
svg {
|
||||||
|
color: var(--pavilion-primary);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.d-icon {
|
.d-icon {
|
||||||
|
@ -942,42 +928,23 @@ $error: #ef1700;
|
||||||
height: 34px;
|
height: 34px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.btn-pavilion-support {
|
|
||||||
&:hover {
|
|
||||||
color: var(--pavilion-secondary);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.wizard-subscription-badge {
|
.wizard-subscription-badge {
|
||||||
margin-right: 5px;
|
margin-right: 5px;
|
||||||
svg {
|
svg {
|
||||||
margin-right: 0.45em;
|
margin-right: 0.45em;
|
||||||
}
|
}
|
||||||
&.none {
|
|
||||||
svg {
|
|
||||||
color: #919191;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
&.community,
|
|
||||||
&.standard,
|
|
||||||
&.business {
|
|
||||||
svg {
|
|
||||||
color: #fff;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.loading-container {
|
|
||||||
svg,
|
|
||||||
div {
|
|
||||||
vertical-align: -moz-middle-with-baseline;
|
|
||||||
vertical-align: -webkit-baseline-middle;
|
|
||||||
margin-right: 3px;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.btn-primary {
|
.btn-primary {
|
||||||
margin-right: 5px;
|
margin-right: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.deauthorize {
|
||||||
|
background-color: var(--secondary);
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
color: var(--primary);
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -2,6 +2,7 @@ $pavilion_primary: #3c1c8c;
|
||||||
$pavilion_secondary: #ffffff;
|
$pavilion_secondary: #ffffff;
|
||||||
$pavilion_warning: rgb(243, 163, 61);
|
$pavilion_warning: rgb(243, 163, 61);
|
||||||
|
|
||||||
|
$subscription_none: $pavilion_primary;
|
||||||
$subscription_standard: $pavilion_primary;
|
$subscription_standard: $pavilion_primary;
|
||||||
$subscription_business: #333;
|
$subscription_business: #333;
|
||||||
$subscription_community: #fff;
|
$subscription_community: #fff;
|
||||||
|
@ -10,6 +11,7 @@ $subscription_community: #fff;
|
||||||
--pavilion-primary: #{$pavilion_primary};
|
--pavilion-primary: #{$pavilion_primary};
|
||||||
--pavilion-secondary: #{$pavilion_secondary};
|
--pavilion-secondary: #{$pavilion_secondary};
|
||||||
--pavilion-warning: #{$pavilion_warning};
|
--pavilion-warning: #{$pavilion_warning};
|
||||||
|
--subscription-none: #{$subscription_none};
|
||||||
--subscription-standard: #{$subscription_standard};
|
--subscription-standard: #{$subscription_standard};
|
||||||
--subscription-business: #{$subscription_business};
|
--subscription-business: #{$subscription_business};
|
||||||
--subscription-community: #{$subscription_community};
|
--subscription-community: #{$subscription_community};
|
||||||
|
|
|
@ -549,7 +549,7 @@ en:
|
||||||
label: Authorize
|
label: Authorize
|
||||||
title: Authorize your subscription on this site
|
title: Authorize your subscription on this site
|
||||||
deauthorize:
|
deauthorize:
|
||||||
label: deauthorize
|
label: Deauthorize
|
||||||
title: Deauthorize your subscription on this site
|
title: Deauthorize your subscription on this site
|
||||||
update:
|
update:
|
||||||
title: "Update subscription status"
|
title: "Update subscription status"
|
||||||
|
@ -563,25 +563,17 @@ en:
|
||||||
selector: not subscribed
|
selector: not subscribed
|
||||||
type:
|
type:
|
||||||
none:
|
none:
|
||||||
label: Not Subscribed
|
label: Subscribe
|
||||||
title: There is no Custom Wizard subscription active on this forum.
|
title: There is no Custom Wizard subscription active on this forum.
|
||||||
business:
|
business:
|
||||||
label: Business
|
label: Support
|
||||||
title: There is a Custom Wizard Business subscription active on this forum.
|
title: There is a Custom Wizard Business subscription active on this forum.
|
||||||
standard:
|
standard:
|
||||||
label: Standard
|
label: Support
|
||||||
title: There is a Custom Wizard Standard subscription active on this forum.
|
title: There is a Custom Wizard Standard subscription active on this forum.
|
||||||
community:
|
community:
|
||||||
label: Community
|
|
||||||
title: There is a Custom Wizard Community subscription active on this forum.
|
|
||||||
cta:
|
|
||||||
none:
|
|
||||||
label: Get a Subscription
|
|
||||||
title: Get a subscription for this forum.
|
|
||||||
subscribed:
|
|
||||||
label: Support
|
label: Support
|
||||||
title: Get support for your subscription.
|
title: There is a Custom Wizard Community subscription active on this forum.
|
||||||
|
|
||||||
|
|
||||||
wizard_js:
|
wizard_js:
|
||||||
group:
|
group:
|
||||||
|
|
|
@ -71,10 +71,6 @@ acceptance("Admin | Custom Wizard Business Subscription", function (needs) {
|
||||||
);
|
);
|
||||||
assert.strictEqual(
|
assert.strictEqual(
|
||||||
query("button.wizard-subscription-badge span").innerText.trim(),
|
query("button.wizard-subscription-badge span").innerText.trim(),
|
||||||
"Business"
|
|
||||||
);
|
|
||||||
assert.strictEqual(
|
|
||||||
query("button.btn-pavilion-support span").innerText.trim(),
|
|
||||||
"Support"
|
"Support"
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
|
@ -71,10 +71,6 @@ acceptance("Admin | Custom Wizard Standard Subscription", function (needs) {
|
||||||
);
|
);
|
||||||
assert.strictEqual(
|
assert.strictEqual(
|
||||||
query("button.wizard-subscription-badge span").innerText.trim(),
|
query("button.wizard-subscription-badge span").innerText.trim(),
|
||||||
"Standard"
|
|
||||||
);
|
|
||||||
assert.strictEqual(
|
|
||||||
query("button.btn-pavilion-support span").innerText.trim(),
|
|
||||||
"Support"
|
"Support"
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
|
@ -84,11 +84,7 @@ acceptance("Admin | Custom Wizard Unsubscribed", function (needs) {
|
||||||
);
|
);
|
||||||
assert.strictEqual(
|
assert.strictEqual(
|
||||||
query("button.wizard-subscription-badge span").innerText.trim(),
|
query("button.wizard-subscription-badge span").innerText.trim(),
|
||||||
"Not Subscribed"
|
"Subscribe"
|
||||||
);
|
|
||||||
assert.strictEqual(
|
|
||||||
query("button.btn-pavilion-support span").innerText.trim(),
|
|
||||||
"Get a Subscription"
|
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
Laden …
In neuem Issue referenzieren