Skip to content

Commit 8c53b03

Browse files
abedshaabanabedshaaban
committed
feat: add SEO overview, SERP preview, and social previews sections
- Implemented SeoOverviewSection to provide an overview of SEO health and issues. - Created SerpPreviewSection to display how the title and meta description appear in search results. - Developed SocialPreviewsSection to analyze and display social media meta tags for various platforms. - Added navigation for switching between SEO sections in SeoTab. - Introduced utility functions for measuring text width and truncating text for SERP previews.
1 parent d8cb1f7 commit 8c53b03

9 files changed

Lines changed: 40 additions & 40 deletions

File tree

‎packages/devtools-seo/src/index.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
export { SeoTab } from './seo-tab'
1+
export { SeoTab } from './tabs/seo-tab'
22
export type {
33
SeoDetailView,
44
SeoIssue,

‎packages/devtools-seo/src/solid-panel.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
/** @jsxImportSource solid-js */
22

33
import { ThemeContextProvider } from '@tanstack/devtools-ui'
4-
import { SeoTab } from './seo-tab'
4+
import { SeoTab } from './tabs/seo-tab'
55

66
type SeoPluginPanelProps = {
77
theme: 'light' | 'dark'

packages/devtools-seo/src/heading-structure-preview.tsx renamed to packages/devtools-seo/src/tabs/heading-structure-preview.tsx

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -7,12 +7,12 @@ import {
77
onMount,
88
} from 'solid-js'
99
import { Section, SectionDescription } from '@tanstack/devtools-ui'
10-
import { useSeoStyles } from './use-seo-styles'
11-
import { pickSeverityClass } from './seo-severity'
12-
import { isInsideDevtools } from './devtools-dom-filter'
13-
import { useLocationChanges } from './hooks/use-location-changes'
14-
import type { SeoSeverity } from './seo-severity'
15-
import type { SeoSectionSummary } from './seo-section-summary'
10+
import { useSeoStyles } from '../use-seo-styles'
11+
import { pickSeverityClass } from '../seo-severity'
12+
import { isInsideDevtools } from '../devtools-dom-filter'
13+
import { useLocationChanges } from '../hooks/use-location-changes'
14+
import type { SeoSeverity } from '../seo-severity'
15+
import type { SeoSectionSummary } from '../seo-section-summary'
1616

1717
type HeadingItem = {
1818
id: string

packages/devtools-seo/src/json-ld-preview.tsx renamed to packages/devtools-seo/src/tabs/json-ld-preview.tsx

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
11
import { For, Show } from 'solid-js'
22
import { Section, SectionDescription } from '@tanstack/devtools-ui'
3-
import { isInsideDevtools } from './devtools-dom-filter'
4-
import { sectionHealthScore } from './seo-section-summary'
5-
import { useSeoStyles } from './use-seo-styles'
6-
import { pickSeverityClass, seoHealthTier } from './seo-severity'
7-
import type { SeoSeverity } from './seo-severity'
8-
import type { SeoSectionSummary } from './seo-section-summary'
3+
import { isInsideDevtools } from '../devtools-dom-filter'
4+
import { sectionHealthScore } from '../seo-section-summary'
5+
import { useSeoStyles } from '../use-seo-styles'
6+
import { pickSeverityClass, seoHealthTier } from '../seo-severity'
7+
import type { SeoSeverity } from '../seo-severity'
8+
import type { SeoSectionSummary } from '../seo-section-summary'
99

1010
type JsonLdValue = Record<string, unknown>
1111

packages/devtools-seo/src/links-preview.tsx renamed to packages/devtools-seo/src/tabs/links-preview.tsx

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
11
import { For, Show, createEffect, createMemo, createSignal } from 'solid-js'
22
import { Section, SectionDescription } from '@tanstack/devtools-ui'
3-
import { isInsideDevtools } from './devtools-dom-filter'
4-
import { useSeoStyles } from './use-seo-styles'
5-
import { countBySeverity } from './seo-section-summary'
6-
import { pickSeverityClass } from './seo-severity'
7-
import { useLocationChanges } from './hooks/use-location-changes'
8-
import type { SeoSectionSummary } from './seo-section-summary'
9-
import type { SeoSeverity } from './seo-severity'
3+
import { isInsideDevtools } from '../devtools-dom-filter'
4+
import { useSeoStyles } from '../use-seo-styles'
5+
import { countBySeverity } from '../seo-section-summary'
6+
import { pickSeverityClass } from '../seo-severity'
7+
import { useLocationChanges } from '../hooks/use-location-changes'
8+
import type { SeoSectionSummary } from '../seo-section-summary'
9+
import type { SeoSeverity } from '../seo-severity'
1010

1111
type LinkKind = 'internal' | 'external' | 'non-web' | 'invalid'
1212

packages/devtools-seo/src/seo-overview.tsx renamed to packages/devtools-seo/src/tabs/seo-overview.tsx

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,24 @@
11
import { For, Show, createMemo, createSignal } from 'solid-js'
22
import { Section, SectionDescription } from '@tanstack/devtools-ui'
3-
import { useHeadChanges } from './hooks/use-head-changes'
4-
import { useLocationChanges } from './hooks/use-location-changes'
5-
import { useSeoStyles } from './use-seo-styles'
6-
import { getCanonicalPageData } from './canonical-url-data'
3+
import { useHeadChanges } from '../hooks/use-head-changes'
4+
import { useLocationChanges } from '../hooks/use-location-changes'
5+
import { useSeoStyles } from '../use-seo-styles'
6+
import { getCanonicalPageData } from '../canonical-url-data'
77
import { getSocialPreviewsSummary } from './social-previews'
88
import { getSerpPreviewSummary } from './serp-preview'
99
import { getJsonLdPreviewSummary } from './json-ld-preview'
1010
import { getHeadingStructureSummary } from './heading-structure-preview'
1111
import { getLinksPreviewSummary } from './links-preview'
12-
import { pickSeverityClass, seoHealthTier } from './seo-severity'
12+
import { pickSeverityClass, seoHealthTier } from '../seo-severity'
1313
import {
1414
aggregateSeoHealth,
1515
countBySeverity,
1616
sectionHealthScore,
1717
totalIssueCount,
1818
worstSeverity,
19-
} from './seo-section-summary'
20-
import type { SeoSeverity } from './seo-severity'
21-
import type { SeoDetailView, SeoSectionSummary } from './seo-section-summary'
19+
} from '../seo-section-summary'
20+
import type { SeoSeverity } from '../seo-severity'
21+
import type { SeoDetailView, SeoSectionSummary } from '../seo-section-summary'
2222

2323
type OverviewRow = {
2424
id: SeoDetailView

packages/devtools-seo/src/seo-tab.tsx renamed to packages/devtools-seo/src/tabs/seo-tab.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,13 @@
11
import { Show, createSignal } from 'solid-js'
22
import { MainPanel } from '@tanstack/devtools-ui'
3-
import { useSeoStyles } from './use-seo-styles'
3+
import { useSeoStyles } from '../use-seo-styles'
44
import { SocialPreviewsSection } from './social-previews'
55
import { SerpPreviewSection } from './serp-preview'
66
import { JsonLdPreviewSection } from './json-ld-preview'
77
import { HeadingStructurePreviewSection } from './heading-structure-preview'
88
import { LinksPreviewSection } from './links-preview'
99
import { SeoOverviewSection } from './seo-overview'
10-
import type { SeoDetailView } from './seo-section-summary'
10+
import type { SeoDetailView } from '../seo-section-summary'
1111

1212
type SeoSubView = 'overview' | SeoDetailView
1313

packages/devtools-seo/src/serp-preview.tsx renamed to packages/devtools-seo/src/tabs/serp-preview.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
11
import { Section, SectionDescription } from '@tanstack/devtools-ui'
22
import { For, createMemo, createSignal } from 'solid-js'
3-
import { useHeadChanges } from './hooks/use-head-changes'
4-
import { useLocationChanges } from './hooks/use-location-changes'
5-
import { tokens } from './tokens'
6-
import { useSeoStyles } from './use-seo-styles'
7-
import type { SeoIssue, SeoSectionSummary } from './seo-section-summary'
3+
import { useHeadChanges } from '../hooks/use-head-changes'
4+
import { useLocationChanges } from '../hooks/use-location-changes'
5+
import { tokens } from '../tokens'
6+
import { useSeoStyles } from '../use-seo-styles'
7+
import type { SeoIssue, SeoSectionSummary } from '../seo-section-summary'
88

99
const ELLIPSIS = '...'
1010
const DESKTOP_TITLE_MAX_WIDTH_PX = 620

packages/devtools-seo/src/social-previews.tsx renamed to packages/devtools-seo/src/tabs/social-previews.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
import { For, createSignal } from 'solid-js'
22
import { Section, SectionDescription } from '@tanstack/devtools-ui'
3-
import { useSeoStyles } from './use-seo-styles'
4-
import { useHeadChanges } from './hooks/use-head-changes'
5-
import type { SeoSectionSummary } from './seo-section-summary'
6-
import type { SeoSeverity } from './seo-severity'
3+
import { useSeoStyles } from '../use-seo-styles'
4+
import { useHeadChanges } from '../hooks/use-head-changes'
5+
import type { SeoSectionSummary } from '../seo-section-summary'
6+
import type { SeoSeverity } from '../seo-severity'
77

88
type SocialAccent =
99
| 'facebook'

0 commit comments

Comments
 (0)