message: feat: add autodiscovery of techdocs annotation in links
diff: * limitations under the License.
  */
  import {
  + DEFAULT_NAMESPACE,
  Entity,
  EntityLink,
  parseEntityRef,
  @@ -62,6 +63,7 @@ import {
  useApp,
  useRouteRef,
  } from '@backstage/core-plugin-api';
  +import { viewTechDocRouteRef } from '@backstage/plugin-catalog/src/routes';
  const useStyles = makeStyles(theme => ({
  cardHeader: {
  @@ -189,6 +191,19 @@ export const TemplateCard = ({ template, deprecated }: TemplateCardProps) => {
  const { name, namespace } = parseEntityRef(stringifyEntityRef(template));
  const href = templateRoute({ templateName: name, namespace });
  + // TechDocs Links
  + const viewTechdocRoute = useRouteRef(viewTechDocRouteRef);
  + const viewTechdocAnnotation =
  + template.metadata.annotations?.['backstage.io/techdocs-ref'];
  + const viewTechdocLink =
  + !!viewTechdocAnnotation &&
  + !!viewTechdocRoute &&
  + viewTechdocRoute({
  + namespace: template.metadata?.namespace || DEFAULT_NAMESPACE,
  + kind: template.kind,
  + name: template.metadata.name,
  + });
  +
  const iconResolver = (key?: string): IconComponent =>
  key ? app.getSystemIcon(key) ?? LanguageIcon : LanguageIcon;
  @@ -260,6 +275,13 @@ export const TemplateCard = ({ template, deprecated }: TemplateCardProps) => {
  </IconButton>
  </Tooltip>
  )}
  + {viewTechdocLink && (
  + <Tooltip title="View TechDocs">
  + <IconButton className={classes.leftButton} href={viewTechdocLink}>
  + <MuiIcon icon={iconResolver('docs')} />
  + </IconButton>
  + </Tooltip>
  + )}
  {templateProps.links?.map((link, i) => (
  <Tooltip key={`${link.url}_${i}`} title={link.title || link.url}>
  <IconButton size="medium" href={link.url}>
  