From dc6403acac3d55dbe75e9ec5a596a2705860d240 Mon Sep 17 00:00:00 2001
From: Z <tdxdxoz@gmail.com>
Date: Fri, 6 Dec 2019 22:10:20 +0800
Subject: [PATCH] =?UTF-8?q?=E4=B8=BA=E9=AB=98=E7=BA=A7web=E6=A8=A1?=
 =?UTF-8?q?=E5=BC=8F=E8=AE=BE=E7=BD=AE=E7=BD=AE=E9=A1=B6=E6=A0=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../mastodon/features/compose/index.js        | 21 +++++++++++++++++++
 .../styles/closed-social/global.scss          |  1 +
 2 files changed, 22 insertions(+)

diff --git a/app/javascript/mastodon/features/compose/index.js b/app/javascript/mastodon/features/compose/index.js
index 3ae236048..c90578ccf 100644
--- a/app/javascript/mastodon/features/compose/index.js
+++ b/app/javascript/mastodon/features/compose/index.js
@@ -18,6 +18,9 @@ import { mascot, treeRoot } from '../../initial_state';
 import Icon from 'mastodon/components/icon';
 import { logOut } from 'mastodon/utils/log_out';
 
+import { pinnedInfo } from '../../initial_state';
+import ReactHtmlParser, { processNodes, convertNodeToElement, htmlparser2 } from 'react-html-parser';
+
 const messages = defineMessages({
   start: { id: 'getting_started.heading', defaultMessage: 'Getting started' },
   home_timeline: { id: 'tabs_bar.home', defaultMessage: 'Home' },
@@ -50,6 +53,10 @@ class Compose extends React.PureComponent {
     intl: PropTypes.object.isRequired,
   };
 
+  state = {
+    showPinned: true,
+  }
+
   componentDidMount () {
     const { isSearchPage } = this.props;
 
@@ -88,9 +95,14 @@ class Compose extends React.PureComponent {
   onBlur = () => {
     this.props.dispatch(changeComposing(false));
   }
+  
+  handleClear = () => {
+    this.setState({ showPinned: false});
+  }
 
   render () {
     const { multiColumn, showSearch, isSearchPage, intl } = this.props;
+    const { showPinned } = this.state;
 
     let header = '';
 
@@ -126,6 +138,15 @@ class Compose extends React.PureComponent {
 
         {(multiColumn || isSearchPage) && <SearchContainer /> }
 
+        { pinnedInfo && showPinned &&
+          <div className='hero-widget__text pinned-info'>
+            {ReactHtmlParser(pinnedInfo)}
+            <div className='pinned-info__icon' onClick={this.handleClear}>
+              <Icon id='times-circle' />
+            </div>
+          </div>
+        }
+
         <div className='drawer__pager'>
           {!isSearchPage && <div className='drawer__inner' onFocus={this.onFocus}>
             <NavigationContainer onClose={this.onBlur} />
diff --git a/app/javascript/styles/closed-social/global.scss b/app/javascript/styles/closed-social/global.scss
index de45f9c39..2290d9461 100644
--- a/app/javascript/styles/closed-social/global.scss
+++ b/app/javascript/styles/closed-social/global.scss
@@ -3,6 +3,7 @@
 }
 
 .pinned-info {
+  position: relative;
 	opacity: 0.85;
   font-size: 15px;
   padding: 10px 20px;