'Open Link in New Tab' Always Opens a Resource Form

[HussainTaj-arbisoft]

The tooltip shown in the above picture only works (correctly) for resource type content.

When used for other types, this UI (tooltip) always opens a resource SiteContent form, regardless of the type of the linked content.

This incorrect form confuses the user. The user can also enter data for the presented fields. This can result in the pollution of data as the user can add resource fields to other types of content.

Expected Behavior

For a content type x, the link should be

.../sites/site-name/type/x/edit/text-id/

Current Behavior

For any content type, the link is

.../sites/site-name/type/resource/edit/text-id/

Steps to Reproduce

1. Create a course.
2. Create two pages.
3. On one page, add a link to the other page using the "Add link" button.
4. Click the added link, the tooltip shows a link. Click the link.
5. Observe the URL of the newly opened tab.

Possible Solution

I believe all we have to do is update the frontend code to consider the linked content's type when generating these tooltip URLs. However, I cannot estimate the effort for this at the moment.

[ChristopherChudzicki]

I believe all we have to do is update the frontend code to consider the linked content's type when generating these tooltip URLs. However, I cannot estimate the effort for this at the moment.

This won't quite work. The tooltips are generated via ResourceLinkMarkdownSyntax, which has two responsibilities:

1. Displaying: Turning a shortcode into HTML... {{< resource_link uuid="abc-123" title="some title" >}} into an HTML tag. The HTML then gets edited via CKEditor.
2. Saving: Turning the HTML tag back into a shortcode when saving.

But really the only information available during this conversion is the shortcode and its arguments (uuid, title). So we don't know the type of the resource.

IMO, the best way to implement this feature would be:

1. Currently, the tooltip always shows /sites/:sitename//resources/:uuid. Instead, provide link /sites/site-name/content/:uuid....
2. Create a new routable page at /site/:sitename/content/:uuid. This page would fetch the resource and re-route to /site/:sitename/pages/:uuid or /site/:sitename/videogalleries/:uuid or /site/:sitename/resources/:uuid based on resource type.

Roughly, the "page" in (2) would look like

import { useParams, useLocation } from "react-router"

/**
 * A page to be served at /content/:uuid that fetches the resource and reroutes
 * the user to the appropriate page, i.e.,
 *  /type/pages/:uuid
 *  /type/resources/:uuid
 *  /type/video-galleries/:uuid
 * etc
 */
const GenericContentReroutePage = () => {
    const { uuid } = useParams() // get the uuid from the URL'
    const location = useLocation() // lets us reroute the user to a different page
    const [resource] = useWebsiteContent(uuid)
    useEffect(() => {
        if (!resource?.type) return
        location.replace({
            pathname: `/type/${resource.type}/${uuid}`
        })
    }, [uuid, location, resource?.type])
}