ViewProfile: left align pinned groups

Fixes urbit/landscape#394
Fixes urbit/landscape#388
This commit is contained in:
Liam Fitzgerald 2021-02-11 18:08:13 +10:00
parent a3a8bf5f2c
commit 8c3a9a2546
No known key found for this signature in database
GPG Key ID: D390E12C61D1CFFB
2 changed files with 24 additions and 16 deletions

View File

@ -230,6 +230,11 @@ export function alphabeticalOrder(a: string, b: string) {
return a.toLowerCase().localeCompare(b.toLowerCase());
}
export function lengthOrder(a: string, b: string) {
return b.length - a.length;
}
// TODO: deprecated
export function alphabetiseAssociations(associations: any) {
const result = {};

View File

@ -17,6 +17,7 @@ import { useHistory } from "react-router-dom";
import {GroupSummary} from "~/views/landscape/components/GroupSummary";
import {MetadataUpdatePreview} from "~/types";
import {GroupLink} from "~/views/components/GroupLink";
import {lengthOrder} from "~/logic/lib/util";
export function ViewProfile(props: any) {
@ -54,22 +55,6 @@ export function ViewProfile(props: any) {
</RichText>
</Center>
</Col>
{ (contact?.groups || []).length > 0 && (
<Col gapY="3" my="3" alignItems="center">
<Text fontWeight="medium">Pinned Groups</Text>
<Row flexWrap="wrap" justifyContent="center" gapX="3">
{ contact?.groups.map(g => (
<GroupLink
api={api}
resource={g}
groups={groups}
associations={associations}
measure={() => {}}
/>
))}
</Row>
</Col>
)}
{ (ship === `~${window.ship}`) ? (
<Row
pb={2}
@ -86,6 +71,24 @@ export function ViewProfile(props: any) {
</Row>
) : null
}
{ (contact?.groups || []).length > 0 && (
<Col gapY="3" mb="3" mt="6" alignItems="flex-start">
<Text fontWeight="medium">Pinned Groups</Text>
<Row flexWrap="wrap" justifyContent="flex-start" gapX="3">
{ contact?.groups.sort(lengthOrder).map(g => (
<GroupLink
mb="3"
api={api}
resource={g}
groups={groups}
associations={associations}
measure={() => {}}
/>
))}
</Row>
</Col>
)}
{ (nacked || (!isPublic && ship === `~${window.ship}`)) ? (
<Box
height="200px"