Start using i18n module to demonstrate string extraction

WordPress · Dec 31, 2024 · c9aa2e6 · c9aa2e6
1 parent cb649d4
commit c9aa2e6
Show file tree

Hide file tree

Showing 3 changed files with 51 additions and 10 deletions.
diff --git a/packages/playground/website/src/components/layout/index.tsx b/packages/playground/website/src/components/layout/index.tsx
@@ -35,6 +35,7 @@ import {
 import { ImportFormModal } from '../import-form-modal';
 import { PreviewPRModal } from '../../github/preview-pr';
 import { MissingSiteModal } from '../missing-site-modal';
+import { __ } from '../../lib/i18n';
 
 acquireOAuthTokenIfNeeded();
 
@@ -90,7 +91,7 @@ export function Layout() {
 			<div className={css.siteView}>
 				{siteManagerIsOpen && (
 					<div
-						title="Open site"
+						title={__('Open site')}
 						className={css.siteViewOverlay}
 						onClick={() => {
 							dispatch(setSiteManagerOpen(false));

diff --git a/packages/playground/website/src/components/site-manager/sidebar/index.tsx b/packages/playground/website/src/components/site-manager/sidebar/index.tsx
@@ -28,6 +28,7 @@ import {
 } from '../../../lib/state/redux/slice-sites';
 import { PlaygroundRoute, redirectTo } from '../../../lib/state/url/router';
 import { setSiteManagerSection } from '../../../lib/state/redux/slice-ui';
+import { __ } from '../../../lib/i18n';
 import { WordPressPRMenuItem } from '../../toolbar-buttons/wordpress-pr-menu-item';
 import { GutenbergPRMenuItem } from '../../toolbar-buttons/gutenberg-pr-menu-item';
 import { RestoreFromZipMenuItem } from '../../toolbar-buttons/restore-from-zip';
@@ -58,19 +59,19 @@ export function Sidebar({
 
 	const resources = [
 		{
-			label: 'Preview WordPress PR',
+			label: __('Preview WordPress PR'),
 			href: '/wordpress.html',
 		},
 		{
-			label: 'More demos',
+			label: __('More demos'),
 			href: '/demos/index.html',
 		},
 		{
-			label: 'Documentation',
+			label: __('Documentation'),
 			href: 'https://wordpress.github.io/wordpress-playground/',
 		},
 		{
-			label: 'GitHub',
+			label: __('GitHub'),
 			href: 'https://github.com/wordpress/wordpress-playground',
 		},
 	];
@@ -106,7 +107,10 @@ export function Sidebar({
 				<DropdownMenu
 					className={css.componentsDropdown}
 					icon={moreVertical}
-					label="Import actions"
+					label={
+						/* translators: Different ways to import code or content into Playground */
+						__('Import actions')
+					}
 					popoverProps={{
 						placement: 'bottom-end',
 					}}
@@ -126,7 +130,10 @@ export function Sidebar({
 								disabled={offline}
 							/>
 							<RestoreFromZipMenuItem
-								text="Import from .zip"
+								text={
+									// translators: Import code and content into Playground from a .zip file
+									__('Import from .zip')
+								}
 								onClose={onClose}
 								disabled={false}
 							/>
@@ -150,7 +157,9 @@ export function Sidebar({
 						isSelected={isTemporarySiteSelected}
 						// eslint-disable-next-line jsx-a11y/aria-role
 						role=""
-						title="This is a temporary Playground. Your changes will be lost on page refresh."
+						title={__(
+							'This is a temporary Playground. Your changes will be lost on page refresh.'
+						)}
 						{...(activeSite?.metadata.storage === 'none'
 							? {
 									'aria-current': 'page',
@@ -168,7 +177,7 @@ export function Sidebar({
 								<ClockIcon className={css.sidebarItemLogo} />
 							</Flex>
 							<FlexBlock className={css.sidebarItemSiteName}>
-								Temporary Playground
+								{__('Temporary Playground')}
 							</FlexBlock>
 						</HStack>
 					</MenuItem>
@@ -196,7 +205,10 @@ export function Sidebar({
 								/>
 							</Flex>
 							<FlexBlock className={css.sidebarItemSiteName}>
-								Blueprints Gallery
+								{
+									// translators: a gallery of WordPress Playground blueprint files
+									__('Blueprints Gallery')
+								}
 							</FlexBlock>
 						</HStack>
 					</MenuItem>

diff --git a/packages/playground/website/website.pot b/packages/playground/website/website.pot
@@ -0,0 +1,28 @@
+msgid ""
+msgstr ""
+"Content-Type: text/plain; charset=UTF-8\n"
+
+#: packages/playground/website/src/components/site-manager/sidebar/index.tsx:70
+msgid "Documentation"
+msgstr ""
+
+#: packages/playground/website/src/components/site-manager/sidebar/index.tsx:74
+msgid "GitHub"
+msgstr ""
+
+#. translators: Different ways to import code or content into Playground
+#: packages/playground/website/src/components/site-manager/sidebar/index.tsx:112
+msgid "Import actions"
+msgstr ""
+
+#: packages/playground/website/src/components/site-manager/sidebar/index.tsx:66
+msgid "More demos"
+msgstr ""
+
+#: packages/playground/website/src/components/layout/index.tsx:94
+msgid "Open site"
+msgstr ""
+
+#: packages/playground/website/src/components/site-manager/sidebar/index.tsx:62
+msgid "Preview WordPress PR"
+msgstr ""