0
0
Fork 1
Spiegel von https://github.com/paviliondev/discourse-custom-wizard.git synchronisiert 2024-11-24 10:20:28 +01:00

Update subscription admin ux

Dieser Commit ist enthalten in:
Angus McLeod 2023-11-17 16:17:10 +01:00
Ursprung 7028471603
Commit 6c6e402153
12 geänderte Dateien mit 50 neuen und 149 gelöschten Zeilen

Datei anzeigen

@ -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>

Datei anzeigen

@ -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

Datei anzeigen

@ -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}}
/>

Datei anzeigen

@ -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();
}
}

Datei anzeigen

@ -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>

Datei anzeigen

@ -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":

Datei anzeigen

@ -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);
}
}
} }
} }

Datei anzeigen

@ -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};

Datei anzeigen

@ -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:

Datei anzeigen

@ -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"
); );
}); });

Datei anzeigen

@ -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"
); );
}); });

Datei anzeigen

@ -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"
); );
}); });