update variable name to rendererOptions

packages/app/src/components/PageComment.tsx

@@ -36,7 +36,7 @@ const PageComment:FC<Props> = memo((props:Props):JSX.Element => {
   } = props;
 
   const { data: comments, mutate } = useSWRxPageComment(pageId);
-  const { data: commentPreviewOptions } = useCommentPreviewOptions();
+  const { data: rendererOptions } = useCommentPreviewOptions();
 
   const [commentToBeDeleted, setCommentToBeDeleted] = useState<ICommentHasId | null>(null);
   const [isDeleteConfirmModalShown, setIsDeleteConfirmModalShown] = useState<boolean>(false);
@@ -112,7 +112,7 @@ const PageComment:FC<Props> = memo((props:Props):JSX.Element => {
 
   const generateCommentInnerElement = (comment: ICommentHasId) => (
     <Comment
-      rendererOptions={commentPreviewOptions}
+      rendererOptions={rendererOptions}
       deleteBtnClicked={onClickDeleteButton}
       comment={comment}
       onComment={mutate}
@@ -124,7 +124,7 @@ const PageComment:FC<Props> = memo((props:Props):JSX.Element => {
     <ReplayComments
       replyList={replyComments}
       deleteBtnClicked={onClickDeleteButton}
-      rendererOptions={commentPreviewOptions}
+      rendererOptions={rendererOptions}
       isReadOnly={isReadOnly}
     />
   );
@@ -144,7 +144,7 @@ const PageComment:FC<Props> = memo((props:Props):JSX.Element => {
     return <></>;
   }
 
-  if (commentPreviewOptions == null) {
+  if (rendererOptions == null) {
     return <></>;
   }
 
@@ -191,7 +191,7 @@ const PageComment:FC<Props> = memo((props:Props):JSX.Element => {
                     {/* display reply editor */}
                     {(!isReadOnly && showEditorIds.has(comment._id)) && (
                       <CommentEditor
-                        rendererOptions={commentPreviewOptions}
+                        rendererOptions={rendererOptions}
                         replyTo={comment._id}
                         onCancelButtonClicked={() => {
                           removeShowEditorId(comment._id);

packages/app/src/components/PageComment/Comment.jsx

@@ -237,7 +237,7 @@ Comment.propTypes = {
 
   comment: PropTypes.object.isRequired,
   isReadOnly: PropTypes.bool.isRequired,
-  rendererOptions: PropTypes.RendererOptions.isRequired,
+  rendererOptions: PropTypes.instanceOf(RendererOptions).isRequired,
   deleteBtnClicked: PropTypes.func.isRequired,
   currentUser: PropTypes.object,
   onComment: PropTypes.func,

packages/app/src/components/PageComment/CommentEditorLazyRenderer.tsx

@@ -16,9 +16,9 @@ const CommentEditorLazyRenderer:FC<Props> = (props:Props):JSX.Element => {
 
   const { pageId } = props;
   const { mutate } = useSWRxPageComment(pageId);
-  const { data: commentPreviewOptions } = useCommentPreviewOptions();
+  const { data: rendererOptions } = useCommentPreviewOptions();
 
-  if (commentPreviewOptions == null) {
+  if (rendererOptions == null) {
     return <></>;
   }
 
@@ -27,7 +27,7 @@ const CommentEditorLazyRenderer:FC<Props> = (props:Props):JSX.Element => {
   return (
     <CommentEditor
       appContainer={appContainer}
-      rendererOptions={commentPreviewOptions}
+      rendererOptions={rendererOptions}
       replyTo={undefined}
       onCommentButtonClicked={mutate}
       isForNewComment

packages/app/src/components/PageComment/ReplayComments.jsx

@@ -109,7 +109,7 @@ ReplayComments.propTypes = {
   appContainer: PropTypes.instanceOf(AppContainer).isRequired,
   pageContainer: PropTypes.instanceOf(PageContainer).isRequired,
 
-  rendererOptions: PropTypes.rendererOptions.isRequired,
+  rendererOptions: PropTypes.instanceOf(RendererOptions).isRequired,
   deleteBtnClicked: PropTypes.func.isRequired,
   isReadOnly: PropTypes.bool.isRequired,
   replyList: PropTypes.array,

packages/app/src/components/PageEditor.tsx

@@ -100,7 +100,7 @@ const PageEditor = (props: Props): JSX.Element => {
   const { data: indentSize, mutate: mutateCurrentIndentSize } = useCurrentIndentSize();
   const { mutate: mutateIsEnabledUnsavedWarning } = useIsEnabledUnsavedWarning();
 
-  const { data: previewOptions } = usePreviewOptions();
+  const { data: rendererOptions } = usePreviewOptions();
 
   // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
   const [markdown, setMarkdown] = useState<string>(pageContainer.state.markdown!);
@@ -392,7 +392,7 @@ const PageEditor = (props: Props): JSX.Element => {
     return <></>;
   }
 
-  if (previewOptions == null) {
+  if (rendererOptions == null) {
     return <></>;
   }
 
@@ -432,7 +432,7 @@ const PageEditor = (props: Props): JSX.Element => {
       <div className="d-none d-lg-block page-editor-preview-container flex-grow-1 flex-basis-0 mw-0">
         <Preview
           markdown={markdown}
-          rendererOptions={previewOptions}
+          rendererOptions={rendererOptions}
           ref={previewRef}
           // isMathJaxEnabled={isMathJaxEnabled}
           renderMathJaxOnInit={false}

packages/app/src/components/PageTimeline.jsx

@@ -50,9 +50,9 @@ class PageTimeline extends React.Component {
   }
 
   UNSAFE_componentWillMount() {
-    const { timelineOptions } = this.props;
+    const { rendererOptions } = this.props;
     // initialize GrowiRenderer
-    this.timelineOptions = timelineOptions;
+    this.rendererOptions = rendererOptions;
   }
 
   async componentDidMount() {
@@ -112,20 +112,20 @@ class PageTimeline extends React.Component {
 PageTimeline.propTypes = {
   t: PropTypes.func.isRequired, // i18next
   appContainer: PropTypes.instanceOf(AppContainer).isRequired,
-  timelineOptions: PropTypes.RendererOptions.isRequired,
+  timelineOptions: PropTypes.instanceOf(RendererOptions).isRequired,
   pageContainer: PropTypes.instanceOf(PageContainer).isRequired,
   pages: PropTypes.arrayOf(PropTypes.object),
 };
 
 const PageTimelineWrapperFC = (props) => {
   const { t } = useTranslation();
-  const { data: timelineOptions } = useTimelineOptions();
+  const { data: rendererOptions } = useTimelineOptions();
 
-  if (timelineOptions == null) {
+  if (rendererOptions == null) {
     return <></>;
   }
 
-  return <PageTimeline t={t} timelineOptions={timelineOptions} {...props} />;
+  return <PageTimeline t={t} rendererOptions={rendererOptions} {...props} />;
 };
 
 /**