landscape: resource descriptions include links

This commit is contained in:
Matilde Park 2020-10-13 21:00:00 -04:00
parent 579ea86d42
commit 093549175f

View File

@ -1,4 +1,4 @@
import React, { useCallback, ReactNode } from "react"; import React, { ReactNode } from "react";
import { Row, Box, Col, Text } from "@tlon/indigo-react"; import { Row, Box, Col, Text } from "@tlon/indigo-react";
import styled from "styled-components"; import styled from "styled-components";
import { Link } from "react-router-dom"; import { Link } from "react-router-dom";
@ -6,8 +6,9 @@ import { Link } from "react-router-dom";
import { ChatResource } from "~/views/apps/chat/ChatResource"; import { ChatResource } from "~/views/apps/chat/ChatResource";
import { PublishResource } from "~/views/apps/publish/PublishResource"; import { PublishResource } from "~/views/apps/publish/PublishResource";
import RichText from '~/views/components/RichText';
import { Association } from "~/types/metadata-update"; import { Association } from "~/types/metadata-update";
import { StoreState } from "~/logic/store/type";
import GlobalApi from "~/logic/api/global"; import GlobalApi from "~/logic/api/global";
import { RouteComponentProps, Route, Switch } from "react-router-dom"; import { RouteComponentProps, Route, Switch } from "react-router-dom";
import { ChannelSettings } from "./ChannelSettings"; import { ChannelSettings } from "./ChannelSettings";
@ -34,6 +35,12 @@ export function ResourceSkeleton(props: ResourceSkeletonProps) {
const appPath = association["app-path"]; const appPath = association["app-path"];
const workspace = (baseUrl === '/~landscape/home') ? '/home' : association["group-path"]; const workspace = (baseUrl === '/~landscape/home') ? '/home' : association["group-path"];
const title = props.title || association?.metadata?.title; const title = props.title || association?.metadata?.title;
const disableRemoteContent = {
audioShown: false,
imageShown: false,
oembedShown: false,
videoShown: false
};
return ( return (
<Col width="100%" height="100%" overflowY="hidden"> <Col width="100%" height="100%" overflowY="hidden">
<Box <Box
@ -70,16 +77,19 @@ export function ResourceSkeleton(props: ResourceSkeletonProps) {
{atRoot && ( {atRoot && (
<> <>
<Box pr={1} mr={2}> <Box pr={1} mr={2}>
<Text>{title}</Text> <Text display='inline-block' verticalAlign='middle'>{title}</Text>
</Box> </Box>
<TruncatedBox <TruncatedBox
display={["none", "block"]} display={["none", "block"]}
maxWidth="60%" maxWidth="60%"
verticalAlign='middle'
flexShrink={1} flexShrink={1}
title={association?.metadata?.description} title={association?.metadata?.description}
color="gray" color="gray"
> >
<RichText color='gray' remoteContentPolicy={disableRemoteContent} mb='0' display='inline-block'>
{association?.metadata?.description} {association?.metadata?.description}
</RichText>
</TruncatedBox> </TruncatedBox>
<Box flexGrow={1} /> <Box flexGrow={1} />
<ChannelMenu association={association} api={api} /> <ChannelMenu association={association} api={api} />