1 files changed, 16 insertions, 23 deletions
diff --git a/src/client/views/nodes/formattedText/RichTextMenu.tsx b/src/client/views/nodes/formattedText/RichTextMenu.tsx
index bd05af977..4814d6e9a 100644
--- a/src/client/views/nodes/formattedText/RichTextMenu.tsx
+++ b/src/client/views/nodes/formattedText/RichTextMenu.tsx
@@ -45,7 +45,7 @@ export class RichTextMenu extends AntimodeMenu<AntimodeMenuProps>   {
     @observable private _activeFontSize: string = "13px";
     @observable private _activeFontFamily: string = "";
     @observable private activeListType: string = "";
-    @observable private activeAlignment: string = "left";
+    @observable private _activeAlignment: string = "left";
 
     @observable private brushMarks: Set<Mark> = new Set();
     @observable private showBrushDropdown: boolean = false;
@@ -86,6 +86,7 @@ export class RichTextMenu extends AntimodeMenu<AntimodeMenuProps>   {
     @computed get fontColor() { return this._activeFontColor; }
     @computed get fontFamily() { return this._activeFontFamily; }
     @computed get fontSize() { return this._activeFontSize; }
+    @computed get textAlign() { return this._activeAlignment; }
 
     public delayHide = () => this._delayHide = true;
 
@@ -115,7 +116,7 @@ export class RichTextMenu extends AntimodeMenu<AntimodeMenuProps>   {
         const activeHighlights = active.activeHighlights;
 
         this.activeListType = this.getActiveListStyle();
-        this.activeAlignment = this.getActiveAlignment();
+        this._activeAlignment = this.getActiveAlignment();
         this._activeFontFamily = !activeFamilies.length ? "Arial" : activeFamilies.length === 1 ? String(activeFamilies[0]) : "various";
         this._activeFontSize = !activeSizes.length ? "13px" : activeSizes[0];
         this._activeFontColor = !activeColors.length ? "black" : activeColors.length > 0 ? String(activeColors[0]) : "...";
@@ -388,29 +389,21 @@ export class RichTextMenu extends AntimodeMenu<AntimodeMenuProps>   {
         dispatch?.(tr.replaceSelectionWith(newNode).removeMark(tr.selection.from - 1, tr.selection.from, mark));
         return true;
     }
-    alignCenter = (view: EditorView, dispatch: any) => {
-        return this.TextView.props.isSelected(true) && this.alignParagraphs(view, "center", dispatch);
-    }
-    alignLeft = (view: EditorView, dispatch: any) => {
-        return this.TextView.props.isSelected(true) && this.alignParagraphs(view, "left", dispatch);
-    }
-    alignRight = (view: EditorView, dispatch: any) => {
-        return this.TextView.props.isSelected(true) && this.alignParagraphs(view, "right", dispatch);
-    }
 
-    alignParagraphs(view: EditorView, align: "left" | "right" | "center", dispatch: any) {
-        var tr = view.state.tr;
-        view.state.doc.nodesBetween(view.state.selection.from, view.state.selection.to, (node, pos, parent, index) => {
-            if (node.type === schema.nodes.paragraph || node.type === schema.nodes.heading) {
-                tr = tr.setNodeMarkup(pos, node.type, { ...node.attrs, align }, node.marks);
-                return false;
-            }
+    align = (view: EditorView, dispatch: any, alignment: "left" | "right" | "center") => {
+        if (this.TextView.props.isSelected(true)) {
+            var tr = view.state.tr;
+            view.state.doc.nodesBetween(view.state.selection.from, view.state.selection.to, (node, pos, parent, index) => {
+                if ([schema.nodes.paragraph, schema.nodes.heading].includes(node.type)) {
+                    tr = tr.setNodeMarkup(pos, node.type, { ...node.attrs, align: alignment }, node.marks);
+                    return false;
+                }
+                view.focus();
+                return true;
+            });
             view.focus();
-            return true;
-        });
-        view.focus();
-        dispatch?.(tr);
-        return true;
+            dispatch?.(tr);
+        }
     }
 
     insetParagraph(state: EditorState<any>, dispatch: any) {