Merge branch 'release/next-userspace' into lf/hark-redux

pkg/interface/src/logic/lib/publish.ts

@@ -87,7 +87,7 @@ export function getLatestRevision(node: GraphNode): [number, string, string, Pos
     return empty
   }
   const [title, body] = rev.post.contents as TextContent[];
-  return [revNum, title.text, body.text, rev.post];
+  return [revNum.toJSNumber(), title.text, body.text, rev.post];
 }
 
 export function getComments(node: GraphNode): GraphNode {

pkg/interface/src/types/index.ts

@@ -9,13 +9,8 @@ export * from './graph-update';
 export * from './hark-update';
 export * from './invite-update';
 export * from './launch-update';
-export * from './link-listen-update';
-export * from './link-update';
 export * from './local-update';
 export * from './metadata-update';
 export * from './noun';
-export * from './permission-update';
-export * from './publish-response';
-export * from './publish-update';
 export * from './s3-update';
 export * from './workspace';

pkg/interface/src/views/apps/chat/components/ChatMessage.tsx

@@ -18,9 +18,6 @@ export const UnreadMarker = React.forwardRef(({ dayBreak, when }, ref) => (
     <Rule borderColor='blue' display={['none', 'block']} m='0' width='2rem' />
     <Text flexShrink='0' display='block' zIndex='2' mx='4' color='blue'>New messages below</Text>
     <Rule borderColor='blue' flexGrow='1' m='0'/>
-    {dayBreak
-      ? <Text display='block' gray mx='4'>{moment(when).calendar(null, { sameElse: DATESTAMP_FORMAT })}</Text>
-      : null}
     <Rule style={{ width: "calc(50% - 48px)" }} borderColor='blue' m='0' />
   </Row>
 ));
@@ -94,7 +91,7 @@ export default class ChatMessage extends Component<ChatMessageProps> {
     const dayBreak = nextMsg && new Date(msg.when).getDate() !== new Date(nextMsg.when).getDate();
 
     const containerClass = `${renderSigil
-      ? `cf pt2 pl3 lh-copy`
+      ? `cf pl2 lh-copy`
       : `items-top cf hide-child`} ${isPending ? 'o-40' : ''} ${className}`
 
     const timestamp = moment.unix(msg.when / 1000).format(renderSigil ? 'hh:mm a' : 'hh:mm');
@@ -130,6 +127,7 @@ export default class ChatMessage extends Component<ChatMessageProps> {
         width='100%'
         display='flex'
         flexWrap='wrap'
+        pt={renderSigil ? 3 : 0}
         pr={3}
         pb={isLastMessage ? 3 : 0}
         ref={this.divRef}
@@ -229,6 +227,7 @@ export class MessageWithSigil extends PureComponent<MessageProps> {
               fontSize={0}
               mr={3}
               mono={!showNickname}
+              fontWeight={(showNickname) ? '500' : '400'}
               className={`mw5 db truncate pointer`}
               ref={e => nameSpan = e}
               onClick={() => {
@@ -249,7 +248,7 @@ export class MessageWithSigil extends PureComponent<MessageProps> {
 
 export const MessageWithoutSigil = ({ timestamp, msg, remoteContentPolicy, measure }) => (
   <>
-    <Text mono gray display='inline-block' pr='1' pt='2px' lineHeight='tall' className="child">{timestamp}</Text>
+    <Text mono gray display='inline-block' pt='2px' lineHeight='tall' className="child">{timestamp}</Text>
     <Box fontSize='14px' className="clamp-message" style={{ flexGrow: 1 }}>
       <MessageContent content={msg.letter} remoteContentPolicy={remoteContentPolicy} measure={measure}/>
     </Box>

pkg/interface/src/views/apps/chat/components/content/code.js

@@ -15,6 +15,7 @@ export default class CodeContent extends Component {
           mono
           p='1'
           my='0'
+          borderRadius='1'
           fontSize='14px'
           overflow='auto'
           maxHeight='10em'
@@ -33,6 +34,7 @@ export default class CodeContent extends Component {
           mono
           my='0'
           p='1'
+          borderRadius='1'
           fontSize='14px'
           overflow='auto'
           maxHeight='10em'

pkg/interface/src/views/apps/chat/components/content/text.js

@@ -30,10 +30,11 @@ const renderers = {
   },
   code: ({language, value}) => {
     return <Text
-              py='1'
+              p='1'
               className='clamp-message'
               fontSize='14px'
               display='block'
+              borderRadius='1'
               mono
               backgroundColor='washedGray'
               overflowX='scroll'

pkg/interface/src/views/apps/launch/app.js

@@ -29,12 +29,6 @@ export default class LaunchApp extends React.Component {
 
   render() {
     const { props } = this;
-    const contact = props.contacts?.['/~/default']?.[window.ship];
-    const sigilColor = contact?.color
-      ? `#${uxToHex(contact.color)}`
-      : props.dark
-      ? '#FFFFFF'
-      : '#000000';
 
     return (
       <>
@@ -67,15 +61,6 @@ export default class LaunchApp extends React.Component {
                 </Row>
               </Box>
             </Tile>
-            <Tile
-              borderColor={adjustHex(sigilColor, -40)}
-              bg={sigilColor}
-              to="/~profile"
-            >
-              <Center height="100%">
-                <Sigil ship={`~${window.ship}`} size={80} color={sigilColor} />
-              </Center>
-            </Tile>
             <Tiles
               tiles={props.launch.tiles}
               tileOrdering={props.launch.tileOrdering}

pkg/interface/src/views/apps/launch/components/tiles/tile.js

@@ -46,7 +46,7 @@ export default class Tile extends React.Component {
         borderRadius={2}
         overflow="hidden"
         bg={bg || "white"}
-        color={props?.color || 'washedGray'}
+        color={props?.color || 'scales.black20'}
         boxShadow={boxShadow || '0 0 0px 1px inset'}
       >
         <Box

pkg/interface/src/views/landscape/components/GroupSwitcher.tsx

@@ -77,7 +77,7 @@ export function GroupSwitcher(props: {
   baseUrl: string;
   recentGroups: string[];
 }) {
-  const { associations, workspace } = props;
+  const { associations, workspace, isAdmin } = props;
   const title = getTitleFromWorkspace(associations, workspace);
   const navTo = (to: string) => `${props.baseUrl}${to}`;
   return (
@@ -152,14 +152,14 @@ export function GroupSwitcher(props: {
                       />
                       <Text> Group Settings</Text>
                     </GroupSwitcherItem>
-                    <GroupSwitcherItem bottom to={navTo("/invites")}>
+                    {isAdmin && (<GroupSwitcherItem bottom to={navTo("/invites")}>
                       <Icon
                         mr={2}
                         color="blue"
-                        icon="CreateGroup"
+                        icon="Users"
                       />
                       <Text color="blue">Invite to group</Text>
-                    </GroupSwitcherItem>
+                    </GroupSwitcherItem>)}
                   </>
                 )}
               </Col>
@@ -173,15 +173,15 @@ export function GroupSwitcher(props: {
             </Row>
           </Dropdown>
           <Row pr={1} justifyContent="flex-end" alignItems="center">
-            {workspace.type === "group" && (
+            {(workspace.type === "group") && (
               <>
-                <Link to={navTo("/invites")}>
+                {isAdmin && (<Link to={navTo("/invites")}>
                   <Icon
                     display="block"
                     color='blue'
-                    icon="CreateGroup"
+                    icon="Users"
                   />
-                </Link>
+                </Link>)}
                 <Link to={navTo("/popover/settings")}>
                   <Icon color='gray' display="block" m={2} icon="Gear" />
                 </Link>

pkg/interface/src/views/landscape/components/GroupsPane.tsx

@@ -82,7 +82,7 @@ export function GroupsPane(props: GroupsPaneProps) {
           workspace={workspace}
         />
       </>
-    ) 
+    )
 
   return (
     <Switch>
@@ -170,6 +170,7 @@ export function GroupsPane(props: GroupsPaneProps) {
               <NewChannel
                 {...routeProps}
                 api={api}
+                baseUrl={baseUrl}
                 associations={associations}
                 groups={groups}
                 group={groupPath}

pkg/interface/src/views/landscape/components/NewChannel.tsx

@@ -108,6 +108,9 @@ export function NewChannel(props: NewChannelProps & RouteComponentProps) {
   };
   return (
     <Col overflowY="auto" p={3}>
+      <Box pb='3' display={['block', 'none']} onClick={() => history.push(props.baseUrl)}>
+        {'<- Back'}
+      </Box>
       <Box fontWeight="bold" mb={4} color="black">
         New Channel
       </Box>

pkg/interface/src/views/landscape/components/Sidebar/Sidebar.tsx

@@ -87,7 +87,7 @@ export function Sidebar(props: SidebarProps) {
   const [config, setConfig] = useLocalStorageState<SidebarListConfig>(
     `group-config:${groupPath || "home"}`,
     {
-      sortBy: "asc",
+      sortBy: "lastUpdated",
       hideUnjoined: false,
     }
   );
@@ -97,10 +97,6 @@ export function Sidebar(props: SidebarProps) {
   const role = props.groups?.[groupPath] ? roleForShip(props.groups[groupPath], window.ship) : undefined;
   const isAdmin = (role === "admin") || (workspace?.type === 'home');
 
-  const newStyle = {
-    display: isAdmin ? "block" : "none"
-  };
-
   return (
     <Col
       display={display}
@@ -119,6 +115,7 @@ export function Sidebar(props: SidebarProps) {
         associations={associations}
         recentGroups={props.recentGroups}
         baseUrl={props.baseUrl}
+        isAdmin={isAdmin}
         workspace={props.workspace}
       />
       <SidebarListHeader
@@ -142,7 +139,7 @@ export function Sidebar(props: SidebarProps) {
       <SidebarStickySpacer flexShrink={0} />
       <Box
         flexShrink="0"
-        display="flex"
+        display={isAdmin ? "flex" : "none"}
         justifyContent="center"
         position="sticky"
         bottom={"8px"}
@@ -151,7 +148,6 @@ export function Sidebar(props: SidebarProps) {
         py="2"
       >
         <Link
-          style={newStyle}
           to={!!groupPath ? `/~landscape${groupPath}/new` : `/~landscape/home/new`}
         >
           <Box

pkg/interface/src/views/landscape/components/Sidebar/SidebarList.tsx

@@ -31,8 +31,7 @@ function sidebarSort(
 
   return {
     asc: alphabetical,
-    desc: (a, b) => alphabetical(b, a),
+    lastUpdated
-    lastUpdated,
   };
 }
 

pkg/interface/src/views/landscape/components/Sidebar/SidebarListHeader.tsx

@@ -87,7 +87,6 @@ export function SidebarListHeader(props: {
                   <Text color="gray">Sort Order</Text>
                 </Box>
                 <Radio mb="1" label="A -> Z" id="asc" name="sortBy" />
-                <Radio mb="1" label="Z -> A" id="desc" name="sortBy" />
                 <Radio label="Last Updated" id="lastUpdated" name="sortBy" />
               </Col>
               <Col px={2}>

pkg/interface/src/views/landscape/components/Sidebar/types.ts

@@ -5,7 +5,7 @@ export type SidebarItemStatus =
   | "disconnected"
   | "loading";
 
-export type SidebarSort = "asc" | "desc" | "lastUpdated";
+export type SidebarSort = "asc" | "lastUpdated";
 
 export interface SidebarListConfig {
   sortBy: SidebarSort;