fix(i18n): whole-phrase greetings and more zh-CN translations

apps/web/core/components/core/modals/bulk-delete-issues-modal.tsx

@@ -177,7 +177,7 @@ export const BulkDeleteIssuesModal = observer(function BulkDeleteIssuesModal(pro
             <input
               type="text"
               className="h-12 w-full border-0 bg-transparent pr-4 pl-11 text-primary outline-none focus:ring-0 sm:text-13"
-              placeholder="Search..."
+              placeholder={t("common.search.label")}
               onChange={(event) => setQuery(event.target.value)}
             />
           </div>

apps/web/core/components/cycles/cycles-view-header.tsx

@@ -100,7 +100,7 @@ export const CyclesViewHeader = observer(function CyclesViewHeader(props: Props)
           <input
             ref={inputRef}
             className="w-full max-w-[234px] border-none bg-transparent text-13 text-primary placeholder:text-placeholder focus:outline-none"
-            placeholder="Search"
+            placeholder={t("common.search.label")}
             value={searchQuery}
             onChange={(e) => updateSearchQuery(e.target.value)}
             onKeyDown={handleInputKeyDown}

apps/web/core/components/cycles/transfer-issues-modal.tsx

@@ -8,6 +8,7 @@ import { useState } from "react";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 import { AlertCircle } from "lucide-react";
+import { useTranslation } from "@plane/i18n";
 import { SearchIcon, CycleIcon, TransferIcon, CloseIcon } from "@plane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { EIssuesStoreType } from "@plane/types";
@@ -23,6 +24,8 @@ type Props = {
 
 export const TransferIssuesModal = observer(function TransferIssuesModal(props: Props) {
   const { isOpen, handleClose, cycleId } = props;
+  // translation
+  const { t } = useTranslation();
   // states
   const [query, setQuery] = useState("");
 
@@ -41,16 +44,16 @@ export const TransferIssuesModal = observer(function TransferIssuesModal(props:
       .then(async () => {
         setToast({
           type: TOAST_TYPE.SUCCESS,
-          title: "Success!",
-          message: "Work items have been transferred successfully",
+          title: t("common.success"),
+          message: t("cycle.transfer_issues_modal.transfer_success"),
         });
         await getCycleDetails(payload.new_cycle_id);
       })
       .catch(() => {
         setToast({
           type: TOAST_TYPE.ERROR,
-          title: "Error!",
-          message: "Unable to transfer work items. Please try again.",
+          title: t("common.error.label"),
+          message: t("cycle.transfer_issues_modal.transfer_error"),
         });
       });
   };
@@ -64,8 +67,8 @@ export const TransferIssuesModal = observer(function TransferIssuesModal(props:
     await Promise.all(cyclesFetch).catch((error) => {
       setToast({
         type: TOAST_TYPE.ERROR,
-        title: "Error",
-        message: error.error || "Unable to fetch cycle details",
+        title: t("common.error.label"),
+        message: error.error || t("cycle.transfer_issues_modal.fetch_details_error"),
       });
     });
   };
@@ -82,7 +85,7 @@ export const TransferIssuesModal = observer(function TransferIssuesModal(props:
         <div className="flex items-center justify-between px-5">
           <div className="flex items-center gap-1">
             <TransferIcon className="w-5 fill-primary" />
-            <h4 className="text-18 font-medium text-primary">Transfer work items</h4>
+            <h4 className="text-18 font-medium text-primary">{t("cycle.transfer_issues_modal.title")}</h4>
           </div>
           <button onClick={handleClose}>
             <CloseIcon className="h-4 w-4" />
@@ -92,7 +95,7 @@ export const TransferIssuesModal = observer(function TransferIssuesModal(props:
           <SearchIcon className="h-4 w-4 text-secondary" />
           <input
             className="text-13 outline-none"
-            placeholder="Search for a cycle..."
+            placeholder={t("cycle.transfer_issues_modal.search_placeholder")}
             onChange={(e) => setQuery(e.target.value)}
             value={query}
           />
@@ -131,13 +134,11 @@ export const TransferIssuesModal = observer(function TransferIssuesModal(props:
             ) : (
               <div className="flex w-full items-center justify-center gap-4 p-5 text-13">
                 <AlertCircle className="h-3.5 w-3.5 text-secondary" />
-                <span className="text-center text-secondary">
-                  You don’t have any current cycle. Please create one to transfer the work items.
-                </span>
+                <span className="text-center text-secondary">{t("cycle.transfer_issues_modal.no_cycles")}</span>
               </div>
             )
           ) : (
-            <p className="text-center text-secondary">Loading...</p>
+            <p className="text-center text-secondary">{t("loading")}</p>
           )}
         </div>
       </div>

apps/web/core/components/home/user-greetings.tsx

@@ -43,15 +43,16 @@ export function UserGreetingsView(props: IUserGreetingsView) {
     minute: "2-digit",
   }).format(currentTime);
 
-  const greeting = parseInt(hour, 10) < 12 ? "morning" : parseInt(hour, 10) < 18 ? "afternoon" : "evening";
+  const greeting =
+    parseInt(hour, 10) < 12 ? "good_morning" : parseInt(hour, 10) < 18 ? "good_afternoon" : "good_evening";
 
   return (
     <div className="my-6 flex flex-col items-center">
       <h2 className="text-center text-20 font-semibold">
-        {t("good")} {t(greeting)}, {user?.first_name} {user?.last_name}
+        {t(greeting)}, {user?.first_name} {user?.last_name}
       </h2>
       <h5 className="flex items-center gap-2 font-medium text-placeholder">
-        <div>{greeting === "morning" ? "🌤️" : greeting === "afternoon" ? "🌥️" : "🌙️"}</div>
+        <div>{greeting === "good_morning" ? "🌤️" : greeting === "good_afternoon" ? "🌥️" : "🌙️"}</div>
         <div>
           {weekDay}, {date} {timeString}
         </div>

apps/web/core/components/inbox/content/issue-properties.tsx

@@ -5,6 +5,7 @@
  */
 
 import { observer } from "mobx-react";
+import { useTranslation } from "@plane/i18n";
 import {
   StatePropertyIcon,
   MembersPropertyIcon,
@@ -42,6 +43,8 @@ type Props = {
 export const InboxIssueContentProperties = observer(function InboxIssueContentProperties(props: Props) {
   const { workspaceSlug, projectId, issue, issueOperations, isEditable, duplicateIssueDetails, isIntakeAccepted } =
     props;
+  // translation
+  const { t } = useTranslation();
 
   const router = useAppRouter();
   // store hooks
@@ -100,7 +103,7 @@ export const InboxIssueContentProperties = observer(function InboxIssueContentPr
                 }
                 disabled={!isEditable}
                 projectId={projectId?.toString() ?? ""}
-                placeholder="Add assignees"
+                placeholder={t("inbox_issue.properties.add_assignees")}
                 multiple
                 buttonVariant={
                   (issue?.assignee_ids || [])?.length > 0 ? "transparent-without-text" : "transparent-with-text"
@@ -144,7 +147,7 @@ export const InboxIssueContentProperties = observer(function InboxIssueContentPr
                 <span>Due date</span>
               </div>
               <DateDropdown
-                placeholder="Add due date"
+                placeholder={t("inbox_issue.properties.add_due_date")}
                 value={issue.target_date || null}
                 onChange={(val) =>
                   issue?.id &&

apps/web/core/components/inbox/modals/select-duplicate.tsx

@@ -141,7 +141,7 @@ export function SelectDuplicateInboxIssueModal(props: Props) {
           <input
             type="text"
             className="h-12 w-full border-0 bg-transparent pr-4 pl-11 text-primary outline-none focus:ring-0 sm:text-13"
-            placeholder="Search..."
+            placeholder={t("common.search.label")}
             onChange={(e) => setQuery(e.target.value)}
           />
         </div>

apps/web/core/components/modules/links/create-update-modal.tsx

@@ -6,6 +6,7 @@
 
 import { useEffect } from "react";
 import { Controller, useForm } from "react-hook-form";
+import { useTranslation } from "@plane/i18n";
 // plane types
 import { Button } from "@plane/propel/button";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
@@ -28,6 +29,8 @@ const defaultValues: ModuleLink = {
 
 export function CreateUpdateModuleLinkModal(props: Props) {
   const { isOpen, handleClose, createLink, updateLink, data } = props;
+  // translation
+  const { t } = useTranslation();
   // form info
   const {
     formState: { errors, isSubmitting },
@@ -54,23 +57,23 @@ export function CreateUpdateModuleLinkModal(props: Props) {
         await createLink(payload);
         setToast({
           type: TOAST_TYPE.SUCCESS,
-          title: "Success!",
-          message: "Module link created successfully.",
+          title: t("common.success"),
+          message: t("entity.add.success", { entity: t("common.link") }),
         });
       } else {
         await updateLink(payload, data.id);
         setToast({
           type: TOAST_TYPE.SUCCESS,
-          title: "Success!",
-          message: "Module link updated successfully.",
+          title: t("common.success"),
+          message: t("entity.update.success", { entity: t("common.link") }),
         });
       }
       onClose();
     } catch (error: any) {
       setToast({
         type: TOAST_TYPE.ERROR,
-        title: "Error!",
-        message: error?.data?.error ?? "Some error occurred. Please try again.",
+        title: t("common.error.label"),
+        message: error?.data?.error ?? t("common.error.message"),
       });
     }
   };
@@ -86,11 +89,13 @@ export function CreateUpdateModuleLinkModal(props: Props) {
     <ModalCore isOpen={isOpen} handleClose={onClose}>
       <form onSubmit={handleSubmit(handleFormSubmit)}>
         <div className="space-y-5 p-5">
-          <h3 className="text-18 font-medium text-secondary">{data ? "Update" : "Add"} link</h3>
+          <h3 className="text-18 font-medium text-secondary">
+            {data ? t("common.update_link") : t("common.add_link")}
+          </h3>
           <div className="mt-2 space-y-3">
             <div>
               <label htmlFor="url" className="mb-2 text-secondary">
-                URL
+                {t("common.url")}
               </label>
               <Controller
                 control={control}
@@ -106,16 +111,16 @@ export function CreateUpdateModuleLinkModal(props: Props) {
                     onChange={onChange}
                     ref={ref}
                     hasError={Boolean(errors.url)}
-                    placeholder="Type or paste a URL"
+                    placeholder={t("common.type_or_paste_a_url")}
                     className="w-full"
                   />
                 )}
               />
             </div>
             <div>
               <label htmlFor="title" className="mb-2 text-secondary">
-                Display title
-                <span className="block text-10">Optional</span>
+                {t("common.display_title")}
+                <span className="block text-10">{t("common.optional")}</span>
               </label>
               <Controller
                 control={control}
@@ -128,7 +133,7 @@ export function CreateUpdateModuleLinkModal(props: Props) {
                     onChange={onChange}
                     ref={ref}
                     hasError={Boolean(errors.title)}
-                    placeholder="What you'd like to see this link as"
+                    placeholder={t("common.link_title_placeholder")}
                     className="w-full"
                   />
                 )}
@@ -138,10 +143,18 @@ export function CreateUpdateModuleLinkModal(props: Props) {
         </div>
         <div className="flex items-center justify-end gap-2 border-t-[0.5px] border-subtle px-5 py-4">
           <Button variant="secondary" size="lg" onClick={onClose}>
-            Cancel
+            {t("common.cancel")}
           </Button>
           <Button variant="primary" size="lg" type="submit" loading={isSubmitting}>
-            {data ? (isSubmitting ? "Updating link" : "Update link") : isSubmitting ? "Adding link" : "Add link"}
+            {`${
+              data
+                ? isSubmitting
+                  ? t("common.updating")
+                  : t("common.update")
+                : isSubmitting
+                  ? t("common.adding")
+                  : t("common.add")
+            } ${t("common.link")}`}
           </Button>
         </div>
       </form>

apps/web/core/components/modules/module-view-header.tsx

@@ -125,7 +125,7 @@ export const ModuleViewHeader = observer(function ModuleViewHeader() {
           <input
             ref={inputRef}
             className="w-full max-w-[234px] border-none bg-transparent text-13 text-primary placeholder:text-placeholder focus:outline-none"
-            placeholder="Search"
+            placeholder={t("common.search.label")}
             value={searchQuery}
             onChange={(e) => updateSearchQuery(e.target.value)}
             onKeyDown={handleInputKeyDown}

apps/web/core/components/pages/list/search-input.tsx

@@ -6,6 +6,7 @@
 
 import { useRef, useState } from "react";
 // plane imports
+import { useTranslation } from "@plane/i18n";
 import { useOutsideClickDetector } from "@plane/hooks";
 import { IconButton } from "@plane/propel/icon-button";
 import { SearchIcon, CloseIcon } from "@plane/propel/icons";
@@ -18,6 +19,8 @@ type Props = {
 
 export function PageSearchInput(props: Props) {
   const { searchQuery, updateSearchQuery } = props;
+  // translation
+  const { t } = useTranslation();
   // states
   const [isSearchOpen, setIsSearchOpen] = useState(false);
   // refs
@@ -64,7 +67,7 @@ export function PageSearchInput(props: Props) {
         <input
           ref={inputRef}
           className="ml-2 w-full max-w-[234px] border-none bg-transparent text-13 text-primary placeholder:text-placeholder focus:outline-none"
-          placeholder="Search pages"
+          placeholder={t("page.page_list.search_placeholder")}
           value={searchQuery}
           onChange={(e) => updateSearchQuery(e.target.value)}
           onKeyDown={handleInputKeyDown}

apps/web/core/components/project-states/create-update/form.tsx

@@ -6,6 +6,7 @@
 
 import { useEffect, useState } from "react";
 import { TwitterPicker } from "react-color";
+import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
 import type { IState } from "@plane/types";
 import { Popover, Input, TextArea } from "@plane/ui";
@@ -31,6 +32,8 @@ function PopoverButton({ color }: { color?: string }) {
 
 export function StateForm(props: TStateForm) {
   const { data, onSubmit, onCancel, buttonDisabled, buttonTitle } = props;
+  // translation
+  const { t } = useTranslation();
   // states
   const [formData, setFromData] = useState<Partial<IState> | undefined>(undefined);
   const [errors, setErrors] = useState<Partial<Record<keyof IState, string>> | undefined>(undefined);
@@ -50,7 +53,7 @@ export function StateForm(props: TStateForm) {
     const name = formData?.name || undefined;
     if (!formData || !name) {
       let currentErrors: Partial<Record<keyof IState, string>> = {};
-      if (!name) currentErrors = { ...currentErrors, name: "Name is required" };
+      if (!name) currentErrors = { ...currentErrors, name: t("name_is_required") };
       setErrors(currentErrors);
       return;
     }
@@ -77,7 +80,7 @@ export function StateForm(props: TStateForm) {
           id="name"
           type="text"
           name="name"
-          placeholder="Name"
+          placeholder={t("common.name")}
           value={formData?.name}
           onChange={(e) => handleFormData("name", e.target.value)}
           hasError={(errors && Boolean(errors.name)) || false}
@@ -90,7 +93,7 @@ export function StateForm(props: TStateForm) {
         <TextArea
           id="description"
           name="description"
-          placeholder="Describe this state for your members."
+          placeholder={t("workflows.workflow_states.description_placeholder")}
           value={formData?.description}
           onChange={(e) => handleFormData("description", e.target.value)}
           hasError={(errors && Boolean(errors.description)) || false}
@@ -102,7 +105,7 @@ export function StateForm(props: TStateForm) {
             {buttonTitle}
           </Button>
           <Button type="button" variant="secondary" size="lg" disabled={buttonDisabled} onClick={onCancel}>
-            Cancel
+            {t("common.cancel")}
           </Button>
         </div>
       </div>