fix(core): adjust payment related text (#4797)

packages/frontend/core/src/commands/affine-settings.tsx

@@ -41,11 +41,11 @@ export function registerAffineSettingsCommands({
     })
   );
 
-  // color schemes
+  // color modes
   unsubs.push(
     registerAffineCommand({
-      id: 'affine:change-color-scheme-to-auto',
-      label: `${t['com.affine.cmdk.affine.color-scheme.to']()} ${t[
+      id: 'affine:change-color-mode-to-auto',
+      label: `${t['com.affine.cmdk.affine.color-mode.to']()} ${t[
         'com.affine.themeSettings.system'
       ]()}`,
       category: 'affine:settings',
@@ -58,8 +58,8 @@ export function registerAffineSettingsCommands({
   );
   unsubs.push(
     registerAffineCommand({
-      id: 'affine:change-color-scheme-to-dark',
-      label: `${t['com.affine.cmdk.affine.color-scheme.to']()} ${t[
+      id: 'affine:change-color-mode-to-dark',
+      label: `${t['com.affine.cmdk.affine.color-mode.to']()} ${t[
         'com.affine.themeSettings.dark'
       ]()}`,
       category: 'affine:settings',
@@ -73,8 +73,8 @@ export function registerAffineSettingsCommands({
 
   unsubs.push(
     registerAffineCommand({
-      id: 'affine:change-color-scheme-to-light',
-      label: `${t['com.affine.cmdk.affine.color-scheme.to']()} ${t[
+      id: 'affine:change-color-mode-to-light',
+      label: `${t['com.affine.cmdk.affine.color-mode.to']()} ${t[
         'com.affine.themeSettings.light'
       ]()}`,
       category: 'affine:settings',

packages/frontend/core/src/components/affine/setting-modal/general-setting/plans/index.tsx

@@ -117,8 +117,7 @@ const Settings = () => {
           You are current on the {{ currentPlan }} plan. If you have any
           questions, please contact our 
           <a
-            href="#"
-            target="_blank"
+            href="mailto:support@toeverything.info"
             style={{ color: 'var(--affine-link-color)' }}
           >
             customer support
@@ -139,7 +138,9 @@ const Settings = () => {
     >
       {Object.values(SubscriptionRecurring).map(recurring => (
         <RadioButton key={recurring} value={recurring}>
-          {getRecurringLabel({ recurring, t })}
+          <span className={styles.radioButtonText}>
+            {getRecurringLabel({ recurring, t })}
+          </span>
           {recurring === SubscriptionRecurring.Yearly && yearlyDiscount && (
             <span className={styles.radioButtonDiscount}>
               {t['com.affine.payment.discount-amount']({
@@ -163,15 +164,17 @@ const Settings = () => {
               pushNotification({
                 type: 'success',
                 title: t['com.affine.payment.updated-notify-title'](),
-                message: t['com.affine.payment.updated-notify-msg']({
-                  plan:
-                    detail.plan === SubscriptionPlan.Free
-                      ? SubscriptionPlan.Free
-                      : getRecurringLabel({
+                message:
+                  detail.plan === SubscriptionPlan.Free
+                    ? t[
+                        'com.affine.payment.updated-notify-msg.cancel-subscription'
+                      ]()
+                    : t['com.affine.payment.updated-notify-msg']({
+                        plan: getRecurringLabel({
                           recurring: recurring as SubscriptionRecurring,
                           t,
                         }),
-                }),
+                      }),
               });
             }}
             {...{ detail, subscription, recurring }}

packages/frontend/core/src/components/affine/setting-modal/general-setting/plans/plan-card.tsx

@@ -92,7 +92,7 @@ export function getPlanDetail(t: ReturnType<typeof useAFFiNEI18N>) {
           t['com.affine.payment.benefit-2'](),
           t['com.affine.payment.benefit-3'](),
           t['com.affine.payment.benefit-4']({ capacity: '100GB' }),
-          t['com.affine.payment.benefit-5']({ capacity: '500M' }),
+          t['com.affine.payment.benefit-5']({ capacity: '100M' }),
           t['com.affine.payment.benefit-6']({ capacity: '10' }),
         ],
       },

packages/frontend/core/src/components/affine/setting-modal/general-setting/plans/style.css.ts

@@ -12,6 +12,13 @@ export const radioButtonDiscount = style({
   color: 'var(--affine-primary-color)',
   fontWeight: 400,
 });
+export const radioButtonText = style({
+  selectors: {
+    '&:first-letter': {
+      textTransform: 'uppercase',
+    },
+  },
+});
 
 export const planCardsWrapper = style({
   paddingRight: 'calc(var(--setting-modal-gap-x) + 30px)',

packages/frontend/core/src/components/pure/cmdk/data.tsx

@@ -250,7 +250,9 @@ export const usePageCommands = () => {
       if (results.every(command => command.originalValue !== query)) {
         results.push({
           id: 'affine:pages:create-page',
-          label: `${t['com.affine.cmdk.affine.create-new-page-as']()} ${query}`,
+          label: t['com.affine.cmdk.affine.create-new-page-as']({
+            keyWord: query,
+          }),
           value: 'affine::create-page' + query, // hack to make the page always showing in the search result
           category: 'affine:creation',
           run: async () => {
@@ -263,9 +265,9 @@ export const usePageCommands = () => {
 
         results.push({
           id: 'affine:pages:create-edgeless',
-          label: `${t[
-            'com.affine.cmdk.affine.create-new-edgeless-as'
-          ]()} ${query}`,
+          label: t['com.affine.cmdk.affine.create-new-edgeless-as']({
+            keyWord: query,
+          }),
           value: 'affine::create-edgeless' + query, // hack to make the page always showing in the search result
           category: 'affine:creation',
           run: async () => {

packages/frontend/i18n/src/resources/en.json

@@ -34,8 +34,8 @@
   "com.affine.aboutAFFiNE.version.title": "Version",
   "com.affine.appearanceSettings.clientBorder.description": "Customise the appearance of the client.",
   "com.affine.appearanceSettings.clientBorder.title": "Client Border Style",
-  "com.affine.appearanceSettings.color.description": "Choose your colour scheme",
-  "com.affine.appearanceSettings.color.title": "Colour Scheme",
+  "com.affine.appearanceSettings.color.description": "Choose your colour mode",
+  "com.affine.appearanceSettings.color.title": "Colour Mode",
   "com.affine.appearanceSettings.date.title": "Date",
   "com.affine.appearanceSettings.dateFormat.description": "Customise your date style.",
   "com.affine.appearanceSettings.dateFormat.title": "Date Format",
@@ -633,9 +633,9 @@
   "com.affine.cmdk.affine.new-page": "New Page",
   "com.affine.cmdk.affine.new-edgeless-page": "New Edgeless",
   "com.affine.cmdk.affine.new-workspace": "New Workspace",
-  "com.affine.cmdk.affine.create-new-page-as": "Create New Page as:",
-  "com.affine.cmdk.affine.create-new-edgeless-as": "Create New Edgeless as:",
-  "com.affine.cmdk.affine.color-scheme.to": "Change Colour Scheme to",
+  "com.affine.cmdk.affine.create-new-page-as": "New \"{{keyWord}}\" Page",
+  "com.affine.cmdk.affine.create-new-edgeless-as": "New \"{{keyWord}}\" Edgeless",
+  "com.affine.cmdk.affine.color-mode.to": "Change Colour Mode to",
   "com.affine.cmdk.affine.left-sidebar.expand": "Expand Left Sidebar",
   "com.affine.cmdk.affine.left-sidebar.collapse": "Collapse Left Sidebar",
   "com.affine.cmdk.affine.navigation.goto-all-pages": "Go to All Pages",
@@ -684,8 +684,8 @@
   "com.affine.auth.sign-out.confirm-modal.description": "After signing out, the Cloud Workspaces associated with this account will be removed from the current device, and signing in again will add them back.",
   "com.affine.auth.sign-out.confirm-modal.cancel": "Cancel",
   "com.affine.auth.sign-out.confirm-modal.confirm": "Sign Out",
-  "com.affine.payment.recurring-yearly": "Annually",
-  "com.affine.payment.recurring-monthly": "Monthly",
+  "com.affine.payment.recurring-yearly": "yearly",
+  "com.affine.payment.recurring-monthly": "monthly",
   "com.affine.payment.title": "Pricing Plans",
   "com.affine.payment.subtitle-not-signed-in": "This is the Pricing plans of AFFiNE Cloud. You can sign up or sign in to your account first.",
   "com.affine.payment.subtitle-active": "You are current on the {{currentPlan}} plan. If you have any questions, please contact our <3>customer support</3>.",
@@ -701,11 +701,11 @@
   "com.affine.payment.change-to": "Change to {{to}} Billing",
   "com.affine.payment.resume": "Resume",
   "com.affine.payment.resume-renewal": "Resume Auto-renewal",
-  "com.affine.payment.benefit-1": "Unlimited local workspace",
+  "com.affine.payment.benefit-1": "Unlimited local workspaces",
   "com.affine.payment.benefit-2": "Unlimited login devices",
   "com.affine.payment.benefit-3": "Unlimited blocks",
-  "com.affine.payment.benefit-4": "AFFiNE Cloud Storage {{capacity}}",
-  "com.affine.payment.benefit-5": "The maximum file size is {{capacity}}",
+  "com.affine.payment.benefit-4": "{{capacity}} of Cloud Storage",
+  "com.affine.payment.benefit-5": "{{capacity}} of maximum file size",
   "com.affine.payment.benefit-6": "Number of members per Workspace ≤ {{capacity}}",
   "com.affine.payment.dynamic-benefit-1": "Best team workspace for collaboration and knowledge distilling.",
   "com.affine.payment.dynamic-benefit-2": "Focusing on what really matters with team project management and automation.",
@@ -728,6 +728,7 @@
   "com.affine.payment.modal.change.confirm": "Change",
   "com.affine.payment.updated-notify-title": "Subscription updated",
   "com.affine.payment.updated-notify-msg": "You have changed your plan to {{plan}} billing.",
+  "com.affine.payment.updated-notify-msg.cancel-subscription": "No further charges will be made starting from the next billing cycle.",
   "com.affine.storage.maximum-tips": "You have reached the maximum capacity limit for your current account",
   "com.affine.payment.tag-tooltips": "See all plans",
   "com.affine.payment.billing-setting.title": "Billing",

tests/affine-local/e2e/quick-search.spec.ts

@@ -101,7 +101,7 @@ test('Create a new page with keyword', async ({ page }) => {
   await clickNewPageButton(page);
   await openQuickSearchByShortcut(page);
   await page.keyboard.insertText('test123456');
-  const addNewPage = page.locator('[cmdk-item] >> text=Create New Page as:');
+  const addNewPage = page.locator('[cmdk-item] >> text=New "test123456" Page');
   await addNewPage.click();
   await page.waitForTimeout(300);
   await assertTitle(page, 'test123456');
@@ -125,7 +125,7 @@ test('Create a new page and search this page', async ({ page }) => {
   // input title and create new page
   await page.keyboard.insertText('test123456');
   await page.waitForTimeout(300);
-  const addNewPage = page.locator('[cmdk-item] >> text=Create New Page as:');
+  const addNewPage = page.locator('[cmdk-item] >> text=New "test123456" Page');
   await addNewPage.click();
 
   await page.waitForTimeout(300);