ilyakooo0/urbit
1
0
Fork 0
mirror of https://github.com/ilyakooo0/urbit.git synced 2025-01-05 22:03:50 +03:00
Code Issues Packages Projects Releases Wiki Activity

LinkWindow: update for new scroll virtualisation

Browse Source
This commit is contained in:
Liam Fitzgerald 2021-02-25 12:02:09 +10:00
parent f669dc48be
commit a960234e2c
No known key found for this signature in database
GPG Key ID: D390E12C61D1CFFB
2 changed files with 1 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
pkg/interface/src/views/apps/links/LinkWindow.tsx
View File

@ -33,20 +33,12 @@ interface LinkWindowProps {
} }
export function LinkWindow(props: LinkWindowProps) { export function LinkWindow(props: LinkWindowProps) {
const { graph, api, association } = props; const { graph, api, association } = props;
const virtualList = useRef<VirtualScroller>();
const fetchLinks = useCallback( const fetchLinks = useCallback(
async (newer: boolean) => { async (newer: boolean) => {
/* stubbed, should we generalize the display of graphs in virtualscroller? */ /* stubbed, should we generalize the display of graphs in virtualscroller? */
}, [] }, []
); );
useEffect(() => {
const list = virtualList?.current;
if(!list)
return;
list.calculateVisibleItems();
}, [graph.size]);
const first = graph.peekLargest()?.[0]; const first = graph.peekLargest()?.[0];
const [,,ship, name] = association.resource.split('/'); const [,,ship, name] = association.resource.split('/');
const canWrite = isWriter(props.group, association.resource); const canWrite = isWriter(props.group, association.resource);
@ -75,14 +67,13 @@ return;
return ( return (
<VirtualScroller <VirtualScroller
ref={l => (virtualList.current = l ?? undefined)}
origin="top" origin="top"
style={style} style={style}
onStartReached={() => {}} onStartReached={() => {}}
onScroll={() => {}} onScroll={() => {}}
data={graph} data={graph}
size={graph.size} size={graph.size}
renderer={({ index, measure, scrollWindow }) => { renderer={({ index, scrollWindow }) => {
const node = graph.get(index); const node = graph.get(index);
const post = node?.post; const post = node?.post;
if (!node || !post) if (!node || !post)
@ -90,7 +81,6 @@ return null;
const linkProps = { const linkProps = {
...props, ...props,
node, node,
measure
}; };
if(canWrite && index.eq(first ?? bigInt.zero)) { if(canWrite && index.eq(first ?? bigInt.zero)) {
return ( return (

11
pkg/interface/src/views/apps/links/components/LinkItem.tsx
View File

@ -19,7 +19,6 @@ interface LinkItemProps {
path: string; path: string;
contacts: Rolodex; contacts: Rolodex;
unreads: Unreads; unreads: Unreads;
measure: (el: any) => void;
} }
export const LinkItem = (props: LinkItemProps): ReactElement => { export const LinkItem = (props: LinkItemProps): ReactElement => {
@ -30,7 +29,6 @@ export const LinkItem = (props: LinkItemProps): ReactElement => {
group, group,
path, path,
contacts, contacts,
measure,
...rest ...rest
} = props; } = props;
@ -93,14 +91,6 @@ export const LinkItem = (props: LinkItemProps): ReactElement => {
const commColor = (props.unreads.graph?.[appPath]?.[`/${index}`]?.unreads ?? 0) > 0 ? 'blue' : 'gray'; const commColor = (props.unreads.graph?.[appPath]?.[`/${index}`]?.unreads ?? 0) > 0 ? 'blue' : 'gray';
const isUnread = props.unreads.graph?.[appPath]?.['/']?.unreads?.has(node.post.index); const isUnread = props.unreads.graph?.[appPath]?.['/']?.unreads?.has(node.post.index);
const onMeasure = useCallback(() => {
ref.current && measure(ref.current);
}, [ref.current, measure]);
useEffect(() => {
onMeasure();
}, [onMeasure]);
return ( return (
<Box mx="auto" px={3} maxWidth="768px" ref={ref} width="100%" {...rest}> <Box mx="auto" px={3} maxWidth="768px" ref={ref} width="100%" {...rest}>
<Box <Box
@ -123,7 +113,6 @@ export const LinkItem = (props: LinkItemProps): ReactElement => {
url={contents[1].url} url={contents[1].url}
text={contents[0].text} text={contents[0].text}
unfold={true} unfold={true}
onLoad={onMeasure}
style={{ alignSelf: 'center' }} style={{ alignSelf: 'center' }}
oembedProps={{ oembedProps={{
p: 2, p: 2,