granblue.team/hensei-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Always show title/raid/author-style party details

Browse source
This commit is contained in:
Justin Edmund 2022-12-25 23:52:24 -08:00
parent db254e87ec
commit c3f8fa57d0
1 changed files with 6 additions and 21 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

27
components/PartyDetails/index.tsx
View file

@ -42,23 +42,24 @@ const PartyDetails = (props: Props) => {
const nameInput = React.createRef<HTMLInputElement>() const nameInput = React.createRef<HTMLInputElement>()
const descriptionInput = React.createRef<HTMLTextAreaElement>() const descriptionInput = React.createRef<HTMLTextAreaElement>()
const [open, setOpen] = useState(false)
const [raidSlug, setRaidSlug] = useState('') const [raidSlug, setRaidSlug] = useState('')
const readOnlyClasses = classNames({ const readOnlyClasses = classNames({
PartyDetails: true, PartyDetails: true,
ReadOnly: true, ReadOnly: true,
Visible: !party.detailsVisible, Visible: true,
}) })
const editableClasses = classNames({ const editableClasses = classNames({
PartyDetails: true, PartyDetails: true,
Editable: true, Editable: true,
Visible: party.detailsVisible, Visible: open,
}) })
const emptyClasses = classNames({ const emptyClasses = classNames({
EmptyDetails: true, EmptyDetails: true,
Visible: !party.detailsVisible, Visible: true,
}) })
const userClass = classNames({ const userClass = classNames({
@ -99,7 +100,7 @@ const PartyDetails = (props: Props) => {
} }
function toggleDetails() { function toggleDetails() {
appState.party.detailsVisible = !appState.party.detailsVisible setOpen(!open)
} }
function receiveRaid(slug?: string) { function receiveRaid(slug?: string) {
@ -284,25 +285,9 @@ const PartyDetails = (props: Props) => {
</section> </section>
) )
const emptyDetails = (
<div className={emptyClasses}>
{party.editable ? (
<Button
accessoryIcon={<EditIcon />}
text={t('buttons.show_info')}
onClick={toggleDetails}
/>
) : (
<div />
)}
</div>
)
return ( return (
<React.Fragment> <React.Fragment>
{editable && (party.name || party.description || party.raid) {readOnly}
? readOnly
: emptyDetails}
{editable} {editable}
</React.Fragment> </React.Fragment>
) )