-
Notifications
You must be signed in to change notification settings - Fork 4.2k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
* add page component * hooked up filtering and table * clean up and add new to page component * style updates to templates page * templates page title * template parts using new page component * change page header size * remove tanstack table * remove filter bar for now and simplify code * update package lock * revert package lock * mobile styles for table view * Fix page header z-index * Don't show description wrapper if description is empty Fixes vertical alignment for custom templates * Adjust alignment of last item in each row * fix table padding and scroll --------- Co-authored-by: James Koster <james@jameskoster.co.uk>
- Loading branch information
1 parent
4464ddb
commit 860a2a0
Showing
12 changed files
with
471 additions
and
55 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
104 changes: 104 additions & 0 deletions
104
packages/edit-site/src/components/page-library/index.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,104 @@ | ||
| /** | ||
| * WordPress dependencies | ||
| */ | ||
| import { | ||
| VisuallyHidden, | ||
| __experimentalHeading as Heading, | ||
| __experimentalVStack as VStack, | ||
| } from '@wordpress/components'; | ||
| import { __ } from '@wordpress/i18n'; | ||
| import { useSelect } from '@wordpress/data'; | ||
| import { store as coreStore, useEntityRecords } from '@wordpress/core-data'; | ||
| import { decodeEntities } from '@wordpress/html-entities'; | ||
|
|
||
| /** | ||
| * Internal dependencies | ||
| */ | ||
| import Page from '../page'; | ||
| import Table from '../table'; | ||
| import Link from '../routes/link'; | ||
| import AddedBy from '../list/added-by'; | ||
| import TemplateActions from '../template-actions'; | ||
| import AddNewTemplate from '../add-new-template'; | ||
| import { store as editSiteStore } from '../../store'; | ||
|
|
||
| export default function PageTemplates() { | ||
| const { records: templateParts } = useEntityRecords( | ||
| 'postType', | ||
| 'wp_template_part', | ||
| { | ||
| per_page: -1, | ||
| } | ||
| ); | ||
|
|
||
| const { canCreate } = useSelect( ( select ) => { | ||
| const { supportsTemplatePartsMode } = | ||
| select( editSiteStore ).getSettings(); | ||
| return { | ||
| postType: select( coreStore ).getPostType( 'wp_template_part' ), | ||
| canCreate: ! supportsTemplatePartsMode, | ||
| }; | ||
| } ); | ||
|
|
||
| const columns = [ | ||
| { | ||
| header: __( 'Template Part' ), | ||
| cell: ( templatePart ) => ( | ||
| <VStack> | ||
| <Heading level={ 5 }> | ||
| <Link | ||
| params={ { | ||
| postId: templatePart.id, | ||
| postType: templatePart.type, | ||
| canvas: 'edit', | ||
| } } | ||
| > | ||
| { decodeEntities( | ||
| templatePart.title?.rendered || | ||
| templatePart.slug | ||
| ) } | ||
| </Link> | ||
| </Heading> | ||
| </VStack> | ||
| ), | ||
| maxWidth: 400, | ||
| }, | ||
| { | ||
| header: __( 'Added by' ), | ||
| cell: ( templatePart ) => ( | ||
| <AddedBy | ||
| postType={ templatePart.type } | ||
| postId={ templatePart.id } | ||
| /> | ||
| ), | ||
| }, | ||
| { | ||
| header: <VisuallyHidden>{ __( 'Actions' ) }</VisuallyHidden>, | ||
| cell: ( templatePart ) => ( | ||
| <TemplateActions | ||
| postType={ templatePart.type } | ||
| postId={ templatePart.id } | ||
| /> | ||
| ), | ||
| }, | ||
| ]; | ||
|
|
||
| return ( | ||
| <Page | ||
| title={ __( 'Template Parts' ) } | ||
| actions={ | ||
| canCreate && ( | ||
| <AddNewTemplate | ||
| templateType={ 'wp_template_part' } | ||
| showIcon={ false } | ||
| toggleProps={ { variant: 'primary' } } | ||
| /> | ||
| ) | ||
| } | ||
| > | ||
| { templateParts && ( | ||
| <Table data={ templateParts } columns={ columns } /> | ||
| ) } | ||
| </Page> | ||
| ); | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,27 @@ | ||
| /** | ||
| * WordPress dependencies | ||
| */ | ||
| import { privateApis as routerPrivateApis } from '@wordpress/router'; | ||
|
|
||
| /** | ||
| * Internal dependencies | ||
| */ | ||
| import PageTemplates from '../page-templates'; | ||
| import PageLibrary from '../page-library'; | ||
| import { unlock } from '../../private-apis'; | ||
|
|
||
| const { useLocation } = unlock( routerPrivateApis ); | ||
|
|
||
| export default function PageMain() { | ||
| const { | ||
| params: { path }, | ||
| } = useLocation(); | ||
|
|
||
| if ( path === '/wp_template/all' ) { | ||
| return <PageTemplates />; | ||
| } else if ( path === '/wp_template_part/all' ) { | ||
| return <PageLibrary />; | ||
| } | ||
|
|
||
| return null; | ||
| } |
104 changes: 104 additions & 0 deletions
104
packages/edit-site/src/components/page-templates/index.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,104 @@ | ||
| /** | ||
| * WordPress dependencies | ||
| */ | ||
| import { | ||
| VisuallyHidden, | ||
| __experimentalHeading as Heading, | ||
| __experimentalText as Text, | ||
| __experimentalVStack as VStack, | ||
| } from '@wordpress/components'; | ||
| import { __ } from '@wordpress/i18n'; | ||
| import { useSelect } from '@wordpress/data'; | ||
| import { store as coreStore, useEntityRecords } from '@wordpress/core-data'; | ||
| import { decodeEntities } from '@wordpress/html-entities'; | ||
|
|
||
| /** | ||
| * Internal dependencies | ||
| */ | ||
| import Page from '../page'; | ||
| import Table from '../table'; | ||
| import Link from '../routes/link'; | ||
| import AddedBy from '../list/added-by'; | ||
| import TemplateActions from '../template-actions'; | ||
| import AddNewTemplate from '../add-new-template'; | ||
| import { store as editSiteStore } from '../../store'; | ||
|
|
||
| export default function PageTemplates() { | ||
| const { records: templates } = useEntityRecords( | ||
| 'postType', | ||
| 'wp_template', | ||
| { | ||
| per_page: -1, | ||
| } | ||
| ); | ||
|
|
||
| const { canCreate } = useSelect( ( select ) => { | ||
| const { supportsTemplatePartsMode } = | ||
| select( editSiteStore ).getSettings(); | ||
| return { | ||
| postType: select( coreStore ).getPostType( 'wp_template' ), | ||
| canCreate: ! supportsTemplatePartsMode, | ||
| }; | ||
| } ); | ||
|
|
||
| const columns = [ | ||
| { | ||
| header: __( 'Template' ), | ||
| cell: ( template ) => ( | ||
| <VStack> | ||
| <Heading level={ 5 }> | ||
| <Link | ||
| params={ { | ||
| postId: template.id, | ||
| postType: template.type, | ||
| canvas: 'edit', | ||
| } } | ||
| > | ||
| { decodeEntities( | ||
| template.title?.rendered || template.slug | ||
| ) } | ||
| </Link> | ||
| </Heading> | ||
| { template.description && ( | ||
| <Text variant="muted"> | ||
| { decodeEntities( template.description ) } | ||
| </Text> | ||
| ) } | ||
| </VStack> | ||
| ), | ||
| maxWidth: 400, | ||
| }, | ||
| { | ||
| header: __( 'Added by' ), | ||
| cell: ( template ) => ( | ||
| <AddedBy postType={ template.type } postId={ template.id } /> | ||
| ), | ||
| }, | ||
| { | ||
| header: <VisuallyHidden>{ __( 'Actions' ) }</VisuallyHidden>, | ||
| cell: ( template ) => ( | ||
| <TemplateActions | ||
| postType={ template.type } | ||
| postId={ template.id } | ||
| /> | ||
| ), | ||
| }, | ||
| ]; | ||
|
|
||
| return ( | ||
| <Page | ||
| title={ __( 'Templates' ) } | ||
| actions={ | ||
| canCreate && ( | ||
| <AddNewTemplate | ||
| templateType={ 'wp_template' } | ||
| showIcon={ false } | ||
| toggleProps={ { variant: 'primary' } } | ||
| /> | ||
| ) | ||
| } | ||
| > | ||
| { templates && <Table data={ templates } columns={ columns } /> } | ||
| </Page> | ||
| ); | ||
| } |
Oops, something went wrong.