Assets from github can't be fetched

In an attempt to work around #377 I went to github.com and edit my note.md file and uploaded a gif to it. And it looks and works fine on github 👇

But when I go to lumen to view that same note it seems the asset isn't being displayed because it keeps facing a network error when fetching them.

Ok my workaround here works after changing the link to the asset for an actual URL to a path to the asset in uploads folder

Oh interesting. I wonder if the github.com image is protected (because I'm assuming your notes repo is private) and Lumen isn't attaching a token when requesting that asset.

@colebemis ah you're right, I think this issue is only with private repos.

We could perhaps add a condition if the image src has github.com in it. But I'm not sure how we can attach the github auth token to the image request.

lumen/src/components/markdown.tsx

Lines 571 to 587 in 0606827

    
           function Image(props: React.ComponentPropsWithoutRef<"img">) { 
        
             // Render local files with FilePreview 
        
             if (props.src?.startsWith("/")) { 
        
               return ( 
        
                 <Link 
        
                   to={`/file?${qs.stringify({ path: props.src })}`} 
        
                   target="_blank" 
        
                   className="block w-fit !no-underline" 
        
                 > 
        
                   <FilePreview path={props.src} alt={props.alt} /> 
        
                 </Link> 
        
               ) 
        
             } 
        
             // eslint-disable-next-line jsx-a11y/alt-text 
        
             return <img {...props} /> 
        
           }

This would be a nice enhancement if it's an easy change but I'm not sure it's worth the effort if it's hard, since Lumen already supports direct image uploads on private repos.

Just learnt something. I dis not about image support in notes

	function Image(props: React.ComponentPropsWithoutRef<"img">) {
	// Render local files with FilePreview
	if (props.src?.startsWith("/")) {
	return (
	<Link
	to={`/file?${qs.stringify({ path: props.src })}`}
	target="_blank"
	className="block w-fit !no-underline"
	>
	<FilePreview path={props.src} alt={props.alt} />
	</Link>
	)
	}

	// eslint-disable-next-line jsx-a11y/alt-text
	return <img {...props} />
	}