BacklinkMonitor

Code

import { type Backlink, BacklinkMonitor } from "@fadymondy/nasaq/web";export function Links({ links }: { links: Backlink[] }) {  return <BacklinkMonitor links={links} onDisavow={async (ids) => { await api.disavow(ids); }} onMarkSafe={async (id) => { await api.safe(id); }} />;}

SEO · beta

Live examples and controls: BacklinkMonitor in the lab.

InstallCopy Anchor Link

npx shadcn@latest add https://docs.nasaqui.com/r/backlink-monitor.json

BacklinkMonitor shows who links to you and how that changes. Summary tiles count links, referring domains, new this week, lost and toxic. A chart plots links gained and lost per day. The table can be filtered by status (new, active, lost, toxic), and toxic links can be disavowed in bulk or marked safe one by one.

When to useCopy Anchor Link

• The link profile part of an SEO dashboard.
• Alerting a team that a valuable link was lost or a spammy one appeared.

When not to useCopy Anchor Link

• Ranking positions: use KeywordTracker.

ImportCopy Anchor Link

import { BacklinkMonitor } from "@fadymondy/nasaq/web";

Quick startCopy Anchor Link

import { type Backlink, BacklinkMonitor } from "@fadymondy/nasaq/web";

export function Links({ links }: { links: Backlink[] }) {
  return <BacklinkMonitor links={links} onDisavow={async (ids) => { await api.disavow(ids); }} onMarkSafe={async (id) => { await api.safe(id); }} />;
}

AnatomyCopy Anchor Link

BacklinkMonitor        data-slot="backlink-monitor"
  MetricTiles          links, domains, new, lost, toxic
  TimeSeriesPanel      gained and lost per day
  DataTable            source, anchor, target, DR, spam score, first seen, status
                       status facet, bulk Disavow

APICopy Anchor Link

BacklinkMonitorCopy Anchor Link

BacklinkCopy Anchor Link

{ id, sourceUrl, targetUrl, anchor, domainRating, spamScore, firstSeen, lostAt?, followed?, disavowed? }. Dates are ISO strings.

HelpersCopy Anchor Link

• backlinkStatus(link, now) gives lost, new (first seen within NEW_LINK_DAYS, 7) or active; lost wins over new.
• isToxic(link) is true from TOXIC_SPAM_SCORE (60) upward, unless disavowed.
• summarizeBacklinks(links, now), referringDomains(links) (live domains counted once, www. ignored), domainOf(url), dailyLinkSeries(links, days, now) and diffBacklinks(before, after).

ExamplesCopy Anchor Link

Only the counts:

import { summarizeBacklinks } from "@fadymondy/nasaq/web";

const { total, toxic, lost } = summarizeBacklinks(links, Date.now());

Read only:

import { BacklinkMonitor } from "@fadymondy/nasaq/web";

<BacklinkMonitor links={links} days={14} />;

AccessibilityCopy Anchor Link

Status is a word, not only a colour. The chart has a visually hidden data table through TimeSeriesPanel.

RTL & i18nCopy Anchor Link

URLs and anchors that are Latin stay left-to-right; Arabic anchors use dir="auto". Dates go through DateTime. Built-in English and Arabic strings.

Styling & tokensCopy Anchor Link

New, lost and toxic use the info, warning and danger tokens. Chart series use --nq-chart-*.

Do / Don'tCopy Anchor Link

• Do confirm in your own flow before disavowing: this screen has no undo.
• Do review toxic links before disavowing; a high spam score is a hint, not a verdict.
• Don't pass Date.now() inside a render loop for now; pass a stable value.

RelatedCopy Anchor Link

• KeywordTracker
• TimeSeriesPanel

LabCopy Anchor Link

https://docs.nasaqui.com/?path=/docs/components-seo-backlink-monitor--docs