30c6b14cf72bf2df4c2ac8a578b09d5053a0b516

Committed 14 Jul 2025 08:34AM UTC coverage: 53.548% (+0.1%) from 53.412%

Build # 30c6b14cf72bf2df4c2ac8a578b09d5053a0b516

Build Type

Pull #22356

github

Committed by

kyrylo-polozenko-newfold

Commit Message

fix: lint js

Pull Request Pull Request #22356: Feature/get redirects

Run Details

8217 of 14316 branches covered (57.4%)

Branch coverage included in aggregate %.

1 of 23 new or added lines in 9 files covered. (4.35%)

105 existing lines in 8 files now uncovered.

30345 of 57698 relevant lines covered (52.59%)

41381.79 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

0.0

/packages/js/src/redirects/routes/redirects.js

import { useMemo } from "@wordpress/element";
import { __, sprintf } from "@wordpress/i18n";
import { Button, Checkbox, Select, SelectField, Table, TextField } from "@yoast/ui-library";
import {
        RouteLayout,
} from "../components";
import { useSelectRedirects } from "../hooks";
import { safeCreateInterpolateElement } from "../../helpers/i18n";
import { FieldsetLayout } from "../../shared-admin/components";
import { ChevronDownIcon } from "@heroicons/react/solid";

/**
 * Redirects component.
 *
 * This component renders the main interface for managing plain (non-regex) redirects
 * within the WordPress SEO admin panel. It provides a form to add new redirects, displays
 * a description with a help link, and includes filter controls and a list of existing redirects.
 *
 * @component
 *
 * @returns {JSX.Element} The rendered Redirects route.
 */
export const Redirects = () => {
        const redirectsManagedLink = useSelectRedirects( "selectLink", [], "https://yoa.st/redirects-learn-more" );
        const redirectsDescription = useMemo( () => safeCreateInterpolateElement(
                sprintf(
                        /**
                         * translators: %1$s expands to an opening anchor tag.
                         * %2$s expands to a closing anchor tag.
                         */
                        __( "Manage and monitor your redirects with ease. Create and edit plain redirects to ensure visitors and search engines reach the right pages. %1$sLearn more about redirects%2$s.", "wordpress-seo" ),
                        "<a>",
                        "</a>"
                ),
                {
                        // eslint-disable-next-line jsx-a11y/anchor-has-content
                        a: <a href={ redirectsManagedLink } target="_blank" rel="noopener noreferrer" />,
                }
        ), [] );

        const redirectTypeDescription = useMemo( () => safeCreateInterpolateElement(
                sprintf(
                        /**
                         * translators: %1$s expands to an opening span tag.
                         * %2$s expands to a closing span tag.
                         */
                        __( "The redirect type is the HTTP response code sent to the browser telling the browser what type of redirect is served. %1$sLearn more about redirect types%2$s.", "wordpress-seo" ),
                        "<span>",
                        "</span>"
                ),
                {
                        span: <span className="yst-text-slate-600 yst-underline" />,
                }
        ), [] );


        return (
                <RouteLayout
                        title={ __( "Redirects", "wordpress-seo" ) }
                        description={ redirectsDescription }
                >
                        <div className="yst-max-w-5xl yst-p-8 yst-opacity-50">
                                <FieldsetLayout
                                        title={ __( "Plain redirects", "wordpress-seo" ) }
                                        description={ __( "Plain redirects automatically send visitors from one URL to another. Use them to fix broken links and improve your site's user experience.", "wordpress-seo" ) }
                                        variant={ "xl" }
                                >
                                        <div className="lg:yst-mt-0 lg:yst-col-span-2 yst-space-y-8">
                                                <div>
                                                        <SelectField
                                                                name="type"
                                                                id="yst-input-type-redirect"
                                                                label={ __( "Redirect Type", "wordpress-seo" ) }
                                                                className="yst-max-w-sm"
                                                                options={ [ { value: 301, label: __( "301 Moved Permatently", "wordpress-seo" ) } ] }
                                                                disabled={ true }
                                                        />
                                                        <div className="yst-text-field__description">
                                                                { redirectTypeDescription }
                                                        </div>
                                                </div>

                                                <TextField
                                                        type="text"
                                                        name="origin"
                                                        id="yst-input-origin-redirect"
                                                        label={ __( "Old URL", "wordpress-seo" ) }
                                                        disabled={  true }
                                                />
                                                <TextField
                                                        type="text"
                                                        name="target"
                                                        id="yst-input-target-redirect"
                                                        label={ __( "New URL", "wordpress-seo" ) }
                                                        disabled={  true }
                                                />
                                        </div>
                                        <Button
                                                id="yst-button-submit-redirect"
                                                type="submit"
                                                disabled={ true }
                                                className="yst-bg-gray-400"
                                        >
                                                { __( "Add redirect", "wordpress-seo" ) }
                                        </Button>
                                </FieldsetLayout>
                        </div>
                        <div className="yst-max-w-5xl yst-px-8 yst-pb-8 yst-opacity-50">
                                <hr className="yst-mb-8" />
                                <>
                                        <div
                                                className="yst-flex yst-justify-start yst-items-end yst-flex-row yst-w-full yst-gap-6"
                                        >
                                                <div className="yst-flex yst-items-end xl:yst-max-w-[256px] yst-w-full">
                                                        <Select
                                                                id="yst-filter-redirect-type-redirect"
                                                                name="filterRedirectType"
                                                                options={ [ { value: "", label: __( "All", "wordpress-seo" ) } ]  }
                                                                className="yst-w-full"
                                                                label={ __( "Filter Redirect type", "wordpress-seo" ) }
                                                                disabled={ true }
                                                        />
                                                </div>
                                        </div>
                                        <Table className="yst-mt-4" variant="minimal">
                                                <Table.Head>
                                                        <Table.Row>
                                                                <Table.Header scope="col" className="yst-flex yst-items-center yst-gap-1">
                                                                        <Checkbox
                                                                                aria-label={ __( "Select all", "wordpress-seo" ) }
                                                                                disabled={ true }
                                                                        />
                                                                        { __( "Type", "wordpress-seo" ) }
                                                                        <Button
                                                                                aria-label={ __( "Sort by Type", "wordpress-seo" ) }
                                                                                as="span"
                                                                                variant="tertiary"
                                                                                className="yst-p-0 yst-text-slate-400"
                                                                                disabled={ true }
                                                                        >
                                                                                <ChevronDownIcon
                                                                                        className="yst-w-4 yst-h-4 yst-transition-transform"
                                                                                />
                                                                        </Button>
                                                                </Table.Header>
                                                                <Table.Header scope="col">{ __( "Old URL", "wordpress-seo" ) }</Table.Header>
                                                                <Table.Header scope="col">{ __( "New URL", "wordpress-seo" ) }</Table.Header>
                                                        </Table.Row>
                                                </Table.Head>

                                                <Table.Body>
                                                        <Table.Row>
                                                                <Table.Cell />
                                                                <Table.Cell className="yst-text-end">{ __( "No items found", "wordpress-seo" ) }</Table.Cell>
                                                                <Table.Cell />
                                                        </Table.Row>
                                                </Table.Body>
                                        </Table>
                                </>
                        </div>
                </RouteLayout>
        );
};

1	import { useMemo } from "@wordpress/element";
2	import { __, sprintf } from "@wordpress/i18n";
3	import { Button, Checkbox, Select, SelectField, Table, TextField } from "@yoast/ui-library";
4	import {
5	RouteLayout,
6	} from "../components";
7	import { useSelectRedirects } from "../hooks";
8	import { safeCreateInterpolateElement } from "../../helpers/i18n";
9	import { FieldsetLayout } from "../../shared-admin/components";
10	import { ChevronDownIcon } from "@heroicons/react/solid";
11
12	/**
13	* Redirects component.
14	*
15	* This component renders the main interface for managing plain (non-regex) redirects
16	* within the WordPress SEO admin panel. It provides a form to add new redirects, displays
17	* a description with a help link, and includes filter controls and a list of existing redirects.
18	*
19	* @component
20	*
21	* @returns {JSX.Element} The rendered Redirects route.
22	*/
23	export const Redirects = () => {	×
NEW 24	const redirectsManagedLink = useSelectRedirects( "selectLink", [], "https://yoa.st/redirects-learn-more" );	×
UNCOV 25	const redirectsDescription = useMemo( () => safeCreateInterpolateElement(	×
26	sprintf(
27	/**
28	* translators: %1$s expands to an opening anchor tag.
29	* %2$s expands to a closing anchor tag.
30	*/
31	__( "Manage and monitor your redirects with ease. Create and edit plain redirects to ensure visitors and search engines reach the right pages. %1$sLearn more about redirects%2$s.", "wordpress-seo" ),
32	"<a>",
33	"</a>"
34	),
35	{
36	// eslint-disable-next-line jsx-a11y/anchor-has-content
37	a: <a href={ redirectsManagedLink } target="_blank" rel="noopener noreferrer" />,
38	}
39	), [] );
40
41	const redirectTypeDescription = useMemo( () => safeCreateInterpolateElement(	×
42	sprintf(
43	/**
44	* translators: %1$s expands to an opening span tag.
45	* %2$s expands to a closing span tag.
46	*/
47	__( "The redirect type is the HTTP response code sent to the browser telling the browser what type of redirect is served. %1$sLearn more about redirect types%2$s.", "wordpress-seo" ),
48	"<span>",
49	"</span>"
50	),
51	{
52	span: <span className="yst-text-slate-600 yst-underline" />,
53	}
54	), [] );
55
56
UNCOV 57	return (	×
58	<RouteLayout
59	title={ __( "Redirects", "wordpress-seo" ) }
60	description={ redirectsDescription }
61	>
62	<div className="yst-max-w-5xl yst-p-8 yst-opacity-50">
63	<FieldsetLayout
64	title={ __( "Plain redirects", "wordpress-seo" ) }
65	description={ __( "Plain redirects automatically send visitors from one URL to another. Use them to fix broken links and improve your site's user experience.", "wordpress-seo" ) }
66	variant={ "xl" }
67	>
68	<div className="lg:yst-mt-0 lg:yst-col-span-2 yst-space-y-8">
69	<div>
70	<SelectField
71	name="type"
72	id="yst-input-type-redirect"
73	label={ __( "Redirect Type", "wordpress-seo" ) }
74	className="yst-max-w-sm"
75	options={ [ { value: 301, label: __( "301 Moved Permatently", "wordpress-seo" ) } ] }
76	disabled={ true }
77	/>
78	<div className="yst-text-field__description">
79	{ redirectTypeDescription }
80	</div>
81	</div>
82
83	<TextField
84	type="text"
85	name="origin"
86	id="yst-input-origin-redirect"
87	label={ __( "Old URL", "wordpress-seo" ) }
88	disabled={ true }
89	/>
90	<TextField
91	type="text"
92	name="target"
93	id="yst-input-target-redirect"
94	label={ __( "New URL", "wordpress-seo" ) }
95	disabled={ true }
96	/>
97	</div>
98	<Button
99	id="yst-button-submit-redirect"
100	type="submit"
101	disabled={ true }
102	className="yst-bg-gray-400"
103	>
104	{ __( "Add redirect", "wordpress-seo" ) }
105	</Button>
106	</FieldsetLayout>
107	</div>
108	<div className="yst-max-w-5xl yst-px-8 yst-pb-8 yst-opacity-50">
109	<hr className="yst-mb-8" />
110	<>
111	<div
112	className="yst-flex yst-justify-start yst-items-end yst-flex-row yst-w-full yst-gap-6"
113	>
114	<div className="yst-flex yst-items-end xl:yst-max-w-[256px] yst-w-full">
115	<Select
116	id="yst-filter-redirect-type-redirect"
117	name="filterRedirectType"
118	options={ [ { value: "", label: __( "All", "wordpress-seo" ) } ] }
119	className="yst-w-full"
120	label={ __( "Filter Redirect type", "wordpress-seo" ) }
121	disabled={ true }
122	/>
123	</div>
124	</div>
125	<Table className="yst-mt-4" variant="minimal">
126	<Table.Head>
127	<Table.Row>
128	<Table.Header scope="col" className="yst-flex yst-items-center yst-gap-1">
129	<Checkbox
130	aria-label={ __( "Select all", "wordpress-seo" ) }
131	disabled={ true }
132	/>
133	{ __( "Type", "wordpress-seo" ) }
134	<Button
135	aria-label={ __( "Sort by Type", "wordpress-seo" ) }
136	as="span"
137	variant="tertiary"
138	className="yst-p-0 yst-text-slate-400"
139	disabled={ true }
140	>
141	<ChevronDownIcon
142	className="yst-w-4 yst-h-4 yst-transition-transform"
143	/>
144	</Button>
145	</Table.Header>
146	<Table.Header scope="col">{ __( "Old URL", "wordpress-seo" ) }</Table.Header>
147	<Table.Header scope="col">{ __( "New URL", "wordpress-seo" ) }</Table.Header>
148	</Table.Row>
149	</Table.Head>
150
151	<Table.Body>
152	<Table.Row>
153	<Table.Cell />
154	<Table.Cell className="yst-text-end">{ __( "No items found", "wordpress-seo" ) }</Table.Cell>
155	<Table.Cell />
156	</Table.Row>
157	</Table.Body>
158	</Table>
159	</>
160	</div>
161	</RouteLayout>
162	);
163	};

Yoast / wordpress-seo / 30c6b14cf72bf2df4c2ac8a578b09d5053a0b516

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous