Skip to content

Commit f8d513f

Browse files
authored
docs: S2 docs bug fixes from testing (#9207)
* include BCP-47 codes in quality docs * add placeholders on mobile search * fix blog and release sorting in mobile search menu * fix search tag selection logic * lint * lint again
1 parent 65c2653 commit f8d513f

File tree

4 files changed

+63
-51
lines changed

4 files changed

+63
-51
lines changed

packages/dev/s2-docs/pages/react-aria/quality.mdx

Lines changed: 35 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -87,41 +87,41 @@ function App() {
8787
### Supported locales
8888

8989
<ul style={{columnWidth: 200, paddingLeft: 16, fontFamily: 'adobe-clean-spectrum-vf'}}>
90-
<li>Arabic (United Arab Emirates)</li>
91-
<li>Bulgarian (Bulgaria)</li>
92-
<li>Chinese (Simplified)</li>
93-
<li>Chinese (Traditional)</li>
94-
<li>Croatian (Croatia)</li>
95-
<li>Czech (Czech Republic)</li>
96-
<li>Danish (Denmark)</li>
97-
<li>Dutch (Netherlands)</li>
98-
<li>English (Great Britain)</li>
99-
<li>English (United States)</li>
100-
<li>Estonian (Estonia)</li>
101-
<li>Finnish (Finland)</li>
102-
<li>French (Canada)</li>
103-
<li>French (France)</li>
104-
<li>German (Germany)</li>
105-
<li>Greek (Greece)</li>
106-
<li>Hebrew (Israel)</li>
107-
<li>Hungarian (Hungary)</li>
108-
<li>Italian (Italy)</li>
109-
<li>Japanese (Japan)</li>
110-
<li>Korean (Korea)</li>
111-
<li>Latvian (Latvia)</li>
112-
<li>Lithuanian (Lithuania)</li>
113-
<li>Norwegian (Norway)</li>
114-
<li>Polish (Poland)</li>
115-
<li>Portuguese (Brazil)</li>
116-
<li>Romanian (Romania)</li>
117-
<li>Russian (Russia)</li>
118-
<li>Serbian (Serbia)</li>
119-
<li>Slovakian (Slovakia)</li>
120-
<li>Slovenian (Slovenia)</li>
121-
<li>Spanish (Spain)</li>
122-
<li>Swedish (Sweden)</li>
123-
<li>Turkish (Turkey)</li>
124-
<li>Ukrainian (Ukraine)</li>
90+
<li>Arabic (United Arab Emirates) (`ar-AE`)</li>
91+
<li>Bulgarian (Bulgaria) (`bg-BG`)</li>
92+
<li>Chinese (Simplified) (`zh-CN`)</li>
93+
<li>Chinese (Traditional) (`zh-TW`)</li>
94+
<li>Croatian (Croatia) (`hr-HR`)</li>
95+
<li>Czech (Czech Republic) (`cs-CZ`)</li>
96+
<li>Danish (Denmark) (`da-DK`)</li>
97+
<li>Dutch (Netherlands) (`nl-NL`)</li>
98+
<li>English (Great Britain) (`en-GB`)</li>
99+
<li>English (United States) (`en-US`)</li>
100+
<li>Estonian (Estonia) (`et-EE`)</li>
101+
<li>Finnish (Finland) (`fi-FI`)</li>
102+
<li>French (Canada) (`fr-CA`)</li>
103+
<li>French (France) (`fr-FR`)</li>
104+
<li>German (Germany) (`de-DE`)</li>
105+
<li>Greek (Greece) (`el-GR`)</li>
106+
<li>Hebrew (Israel) (`he-IL`)</li>
107+
<li>Hungarian (Hungary) (`hu-HU`)</li>
108+
<li>Italian (Italy) (`it-IT`)</li>
109+
<li>Japanese (Japan) (`ja-JP`)</li>
110+
<li>Korean (Korea) (`ko-KR`)</li>
111+
<li>Latvian (Latvia) (`lv-LV`)</li>
112+
<li>Lithuanian (Lithuania) (`lt-LT`)</li>
113+
<li>Norwegian (Norway) (`nb-NO`)</li>
114+
<li>Polish (Poland) (`pl-PL`)</li>
115+
<li>Portuguese (Brazil) (`pt-BR`)</li>
116+
<li>Romanian (Romania) (`ro-RO`)</li>
117+
<li>Russian (Russia) (`ru-RU`)</li>
118+
<li>Serbian (Serbia) (`sr-SP`)</li>
119+
<li>Slovakian (Slovakia) (`sk-SK`)</li>
120+
<li>Slovenian (Slovenia) (`sl-SI`)</li>
121+
<li>Spanish (Spain) (`es-ES`)</li>
122+
<li>Swedish (Sweden) (`sv-SE`)</li>
123+
<li>Turkish (Turkey) (`tr-TR`)</li>
124+
<li>Ukrainian (Ukraine) (`uk-UA`)</li>
125125
</ul>
126126

127127
## Interactions

packages/dev/s2-docs/src/MobileSearchMenu.tsx

Lines changed: 26 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -283,18 +283,31 @@ function MobileNav({pages, currentPage}: {pages: Page[], currentPage: Page}) {
283283

284284
let filteredPages = filterPages(pages, searchValue);
285285

286-
return filteredPages
287-
.sort((a, b) => getPageTitle(a).localeCompare(getPageTitle(b)))
288-
.map(page => ({id: page.url.replace(/^\//, ''), name: getPageTitle(page), href: page.url, description: stripMarkdown(page.exports?.description)}));
286+
let items = filteredPages.map(page => ({
287+
id: page.url.replace(/^\//, ''),
288+
name: getPageTitle(page),
289+
href: page.url,
290+
description: stripMarkdown(page.exports?.description),
291+
date: page.exports?.date
292+
}));
293+
294+
return sortItemsForDisplay(items, searchValue);
289295
};
290296

291297
let getAllContent = (libraryId: string, searchValue: string = ''): ComponentCardItem[] => {
292298
let librarySections = getSectionsForLibrary(libraryId);
293299
let allPages = Array.from(librarySections.values()).flat();
294300
let filteredPages = filterPages(allPages, searchValue);
295-
return filteredPages
296-
.sort((a, b) => getPageTitle(a).localeCompare(getPageTitle(b)))
297-
.map(page => ({id: page.url.replace(/^\//, ''), name: getPageTitle(page), href: page.url, description: stripMarkdown(page.exports?.description)}));
301+
302+
let items = filteredPages.map(page => ({
303+
id: page.url.replace(/^\//, ''),
304+
name: getPageTitle(page),
305+
href: page.url,
306+
description: stripMarkdown(page.exports?.description),
307+
date: page.exports?.date
308+
}));
309+
310+
return sortItemsForDisplay(items, searchValue);
298311
};
299312

300313
let getItemsForSelection = (section: string | undefined, libraryId: string, searchValue: string = ''): ComponentCardItem[] => {
@@ -363,8 +376,7 @@ function MobileNav({pages, currentPage}: {pages: Page[], currentPage: Page}) {
363376
searchValue,
364377
sectionsForDisplay.map(s => ({id: s.id, name: s.name})),
365378
resourceTags,
366-
initialSelectedSection,
367-
currentPage.exports?.title
379+
initialSelectedSection
368380
);
369381

370382
const sectionTags = useSectionTagsForDisplay(
@@ -428,6 +440,11 @@ function MobileNav({pages, currentPage}: {pages: Page[], currentPage: Page}) {
428440
</div>
429441
{libraries.map(library => {
430442
const isIconsSelected = selectedSection === 'icons' && library.id === 'react-spectrum';
443+
const libraryResourceTags = getResourceTags(library.id);
444+
const selectedResourceTag = libraryResourceTags.find(tag => tag.id === selectedSection);
445+
const placeholderText = selectedResourceTag
446+
? `Search ${selectedResourceTag.name}`
447+
: `Search ${library.label}`;
431448
return (
432449
<MobileTabPanel key={library.id} id={library.id}>
433450
<Autocomplete filter={isIconsSelected ? iconFilter : undefined}>
@@ -438,6 +455,7 @@ function MobileNav({pages, currentPage}: {pages: Page[], currentPage: Page}) {
438455
onChange={handleSearchChange}
439456
onFocus={handleSearchFocus}
440457
onBlur={handleSearchBlur}
458+
placeholder={placeholderText}
441459
styles={style({marginX: 16})} />
442460
<div className={style({overflow: 'auto', paddingX: 8, paddingBottom: 8})}>
443461
<SearchTagGroups

packages/dev/s2-docs/src/SearchMenu.tsx

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -146,8 +146,7 @@ export function SearchMenu(props: SearchMenuProps) {
146146
searchValue,
147147
sectionTags,
148148
resourceTags,
149-
currentPage.exports?.section?.toLowerCase() || 'components',
150-
currentPage.exports?.title
149+
currentPage.exports?.section?.toLowerCase() || 'components'
151150
);
152151

153152
const filteredIcons = useFilteredIcons(searchValue);

packages/dev/s2-docs/src/searchUtils.tsx

Lines changed: 1 addition & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -207,8 +207,7 @@ export function useSearchTagSelection(
207207
searchValue: string,
208208
sectionTags: Tag[],
209209
resourceTags: Tag[],
210-
initialTagId: string,
211-
title: string
210+
initialTagId: string
212211
) {
213212
const [selectedTagId, setSelectedTagId] = useState<string>(initialTagId);
214213
const prevSearchWasEmptyRef = useRef<boolean>(true);
@@ -237,10 +236,6 @@ export function useSearchTagSelection(
237236
prevSearchWasEmptyRef.current = isEmpty;
238237
}, [searchValue, isResourceSelected]);
239238

240-
if (selectedTagId === 'overview' && title === 'Home') {
241-
setSelectedTagId('components');
242-
}
243-
244239
return [selectedTagId, setSelectedTagId] as const;
245240
}
246241

0 commit comments

Comments
 (0)