Merge pull request #1950 from visuddhinanda/agile

add ArticleEditTools in edit widget

dashboard/src/components/article/ArticleEdit.tsx

@@ -22,6 +22,7 @@ import PublicitySelect from "../../components/studio/PublicitySelect";
 import MDEditor from "@uiw/react-md-editor";
 import ArticlePrevDrawer from "../../components/article/ArticlePrevDrawer";
 import { IStudio } from "../auth/Studio";
+import ArticleEditTools from "./ArticleEditTools";
 
 interface IFormData {
   uid: string;
@@ -58,6 +59,7 @@ const ArticleEditWidget = ({
   const [content, setContent] = useState<string>();
   const [owner, setOwner] = useState<IStudio>();
   const formRef = useRef<ProFormInstance>();
+  const [title, setTitle] = useState<string>();
 
   return unauthorized ? (
     <Result
@@ -80,6 +82,14 @@ const ArticleEditWidget = ({
           }
         />
       ) : undefined}
+      <div style={{ display: "flex", justifyContent: "space-between" }}>
+        <span></span>
+        <ArticleEditTools
+          studioName={studioName}
+          articleId={articleId}
+          title={title}
+        />
+      </div>
       <ProForm<IFormData>
         formRef={formRef}
         onFinish={async (values: IFormData) => {
@@ -127,6 +137,7 @@ const ArticleEditWidget = ({
             setReadonly(mReadonly);
             mTitle = res.data.title;
             setContent(res.data.content);
+            setTitle(res.data.title);
           } else {
             setUnauthorized(true);
             mTitle = "无权访问";

dashboard/src/components/article/ArticleEditDrawer.tsx

@@ -52,13 +52,6 @@ const ArticleEditDrawerWidget = ({
         onClose={onDrawerClose}
         open={openDrawer}
         destroyOnClose={true}
-        extra={
-          <ArticleEditTools
-            studioName={studioName}
-            articleId={articleId}
-            title={title}
-          />
-        }
       >
         <ArticleEdit
           anthologyId={anthologyId}

dashboard/src/components/article/ArticleEditTools.tsx

@@ -44,7 +44,7 @@ const ArticleEditToolsWidget = ({
         />
       ) : undefined}
       <Link to={`/article/article/${articleId}`} target="_blank">
-        {intl.formatMessage({ id: "buttons.open.in.library" })}
+        {intl.formatMessage({ id: "buttons.open.in.tab" })}
       </Link>
       <ArticleTplModal
         title={title}

dashboard/src/components/auth/Studio.tsx

@@ -26,7 +26,11 @@ const StudioWidget = ({
 }: IWidget) => {
   let colorIndex = 0;
   if (data?.nickName) {
-    colorIndex = data?.nickName?.charCodeAt(0) % avatarColor.length;
+    let char = 0;
+    if (data.nickName.length > 1) {
+      char = data.nickName.length - 1;
+    }
+    colorIndex = data.nickName.charCodeAt(char) % avatarColor.length;
   }
 
   return (

dashboard/src/locales/en-US/buttons.ts

@@ -85,6 +85,7 @@ const items = {
   "buttons.add_to_anthology": "Add to Anthology",
   "buttons.open.in.studio": "Open in Studio",
   "buttons.admin": "admin",
+  "buttons.open.in.tab": "Open in New Tab",
 };
 
 export default items;

dashboard/src/locales/zh-Hans/buttons.ts

@@ -85,6 +85,7 @@ const items = {
   "buttons.add_to_anthology": "添加到文集",
   "buttons.open.in.studio": "在Studio中打开",
   "buttons.admin": "后台管理",
+  "buttons.open.in.tab": "在新标签页中打开",
 };
 
 export default items;