Signal/Desktop
1
0
Fork 0
mirror of https://github.com/signalapp/Signal-Desktop.git synced 2026-04-22 09:28:14 +01:00
Code Issues Packages Projects Releases Wiki Activity

Move left pane entirely to React

Browse Source
This commit is contained in:
Scott Nonnenberg
2019-01-14 13:49:58 -08:00
parent bf904ddd12
commit b3ac1373fa
142 changed files with 5016 additions and 3428 deletions
Download Patch File Download Diff File Expand all files Collapse all files

58
ts/components/MainHeader.md
View File

@@ -1,11 +1,65 @@
Note that this component is controlled, so the text in the search box will only update
if the parent of this component feeds the updated `searchTerm` back.
#### With image
```jsx
<MainHeader avatarPath={util.gifObjectUrl} i18n={util.i18n} />
<util.LeftPaneContext theme={util.theme}>
<MainHeader
searchTerm=""
avatarPath={util.gifObjectUrl}
search={text => console.log('search', text)}
updateSearchTerm={text => console.log('updateSearchTerm', text)}
clearSearch={() => console.log('clearSearch')}
i18n={util.i18n}
/>
</util.LeftPaneContext>
```
#### Just name
```jsx
<MainHeader name="John Smith" color="purple" i18n={util.i18n} />
<util.LeftPaneContext theme={util.theme}>
<MainHeader
searchTerm=""
name="John Smith"
color="purple"
search={text => console.log('search', text)}
updateSearchTerm={text => console.log('updateSearchTerm', text)}
clearSearch={() => console.log('clearSearch')}
i18n={util.i18n}
/>
</util.LeftPaneContext>
```
#### Just phone number
```jsx
<util.LeftPaneContext theme={util.theme}>
<MainHeader
searchTerm=""
phoneNumber="+15553004000"
color="green"
search={text => console.log('search', text)}
updateSearchTerm={text => console.log('updateSearchTerm', text)}
clearSearch={() => console.log('clearSearch')}
i18n={util.i18n}
/>
</util.LeftPaneContext>
```
#### Starting with a search term
```jsx
<util.LeftPaneContext theme={util.theme}>
<MainHeader
name="John Smith"
color="purple"
searchTerm="Hewwo?"
search={text => console.log('search', text)}
updateSearchTerm={text => console.log('updateSearchTerm', text)}
clearSearch={() => console.log('clearSearch')}
i18n={util.i18n}
/>
</util.LeftPaneContext>
```