martin/databag
1
0
Fork 0
mirror of https://github.com/balzack/databag.git synced 2025-02-12 03:29:16 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

render placeholder for profile details

Browse Source
This commit is contained in:
Roland Osborne 2022-09-02 10:37:01 -07:00
parent 9219cf6a5b
commit 5820ec7e2d
4 changed files with 46 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
net/web/src/session/contact/Contact.jsx
View File

@ -30,7 +30,12 @@ export function Contact({ close, guid, listing }) {
const Details = ( const Details = (
<div class="details"> <div class="details">
<div class="name"> <div class="name">
<div class="data">{ state.name }</div> { state.name && (
<div class="data">{ state.name }</div>
)}
{ !state.name && (
<div class="data notset">name</div>
)}
</div> </div>
{ state.node && ( { state.node && (
<div class="location"> <div class="location">
@ -40,11 +45,21 @@ export function Contact({ close, guid, listing }) {
)} )}
<div class="location"> <div class="location">
<EnvironmentOutlined /> <EnvironmentOutlined />
<div class="data">{ state.location }</div> { state.location && (
<div class="data">{ state.location }</div>
)}
{ !state.location && (
<div class="data notset">location</div>
)}
</div> </div>
<div class="description"> <div class="description">
<BookOutlined /> <BookOutlined />
<div class="data">{ state.description }</div> { state.description && (
<div class="data">{ state.description }</div>
)}
{ !state.description && (
<div class="data notset">description</div>
)}
</div> </div>
{ state.status === 'connected' && ( { state.status === 'connected' && (

5
net/web/src/session/contact/Contact.styled.js
View File

@ -53,6 +53,11 @@ export const ContactWrapper = styled.div`
display: flex; display: flex;
flex-direction: column; flex-direction: column;
.notset {
font-style: italic;
color: ${Colors.grey};
}
.name { .name {
display: flex; display: flex;
flex-direction: row; flex-direction: row;

21
net/web/src/session/profile/Profile.jsx
View File

@ -72,18 +72,33 @@ export function Profile({ closeProfile }) {
const Details = ( const Details = (
<div class="details"> <div class="details">
<div class="name" onClick={actions.setEditProfileDetails}> <div class="name" onClick={actions.setEditProfileDetails}>
<div class="data">{ state.name }</div> { state.name && (
<div class="data">{ state.name }</div>
)}
{ !state.name && (
<div class="data notset">name</div>
)}
<div class="icon"> <div class="icon">
<EditOutlined /> <EditOutlined />
</div> </div>
</div> </div>
<div class="location"> <div class="location">
<EnvironmentOutlined /> <EnvironmentOutlined />
<div class="data">{ state.location }</div> { state.location && (
<div class="data">{ state.location }</div>
)}
{ !state.location && (
<div class="data notset">location</div>
)}
</div> </div>
<div class="description"> <div class="description">
<BookOutlined /> <BookOutlined />
<div class="data">{ state.description }</div> { state.description && (
<div class="data">{ state.description }</div>
)}
{ !state.description && (
<div class="data notset">description</div>
)}
</div> </div>
</div> </div>
); );

5
net/web/src/session/profile/Profile.styled.js
View File

@ -73,6 +73,11 @@ export const ProfileWrapper = styled.div`
display: flex; display: flex;
flex-direction: column; flex-direction: column;
.notset {
font-style: italic;
color: ${Colors.grey};
}
.name { .name {
display: flex; display: flex;
flex-direction: row; flex-direction: row;