← All changes | js/components/ManageMenu/CommunityCloud/CommunityCloud.tsx +25 -26 3.10.0-beta.1 → trunk View file →

		@@ -1,8 +1,9 @@
1	1	import React, { useState } from 'react'
2	2	import { __, sprintf } from '@wordpress/i18n'
3	3	import { WithRestAPIContext } from '../../../hooks/useRestAPI'
4	4	import { useSnippetView } from '../../../hooks/useSnippetView'
	5	+import { isLicensed } from '../../../utils/screen'
5	6	import { updateQueryParams } from '../../../utils/urls'
6	7	import { ScreenMetaSlot } from '../../common/ScreenMetaSlot'
7	8	import { SubnavTabs, getTabFromQuery } from '../../common/SubnavTabs'
8	9	import { WithCloudSnippetDownloadsContext } from '../../common/cloud/WithCloudSnippetDownloadsContext'
		@@ -8,13 +9,13 @@
8	9	import { WithCloudSnippetDownloadsContext } from '../../common/cloud/WithCloudSnippetDownloadsContext'
9	10	import { UpsellPage } from '../../common/UpsellDialog'
10	11	import { WithCloudSearchContext, useCloudSearch } from './WithCloudSearchContext'
11	12	import { CloudSearch } from './CloudSearch'
12		-import type { SubnavTab} from '../../common/SubnavTabs'
	13	+import type { SubnavTab } from '../../common/SubnavTabs'
13	14
14	15	const TAB_QUERY_PARAM = 'tab'
15	16
16		-const TABS: SubnavTab[] = [
	17	+const TABS: SubnavTab<'snippets' | 'bundles'>[] = [
17	18	{
18	19	name: 'snippets',
19	20	label: __('Snippets', 'code-snippets')
20	21	},
		@@ -29,21 +30,8 @@
29	30	const [currentTab, setCurrentTab] = useState(() => getTabFromQuery(TABS, TAB_QUERY_PARAM))
30	31	const { snippetView, setSnippetView } = useSnippetView()
31	32	const { searchResults } = useCloudSearch()
32	33
33		- const TabContent = () => {
34		- switch (currentTab.name) {
35		- case 'snippets':
36		- return <CloudSearch snippetView={snippetView} setSnippetView={setSnippetView} />
37		-
38		- case 'bundles':
39		- return <UpsellPage />
40		-
41		- default:
42		- return null
43		- }
44		- }
45		-
46	34	return (
47	35	<>
48	36	<SubnavTabs
49	37	className="community-cloud-nav"
		@@ -56,23 +44,34 @@
56	44	setCurrentTab(tab)
57	45	}}
58	46	/>
59	47
60		- <ScreenMetaSlot />
	48	+ <ScreenMetaSlot hidden={'bundles' === currentTab.name} />
61	49
62		- <div className="snippets-page-header">
63		- <h1>{
64		- // translators: %s: label of the currently selected community cloud tab.
65		- sprintf(__('Community Cloud: %s', 'code-snippets'), currentTab.label)}</h1>
66		- </div>
	50	+ {(!currentTab.pro || isLicensed()) && (
	51	+ <>
	52	+ <div className="snippets-page-header">
	53	+ <h1>{
	54	+ // translators: %s: label of the currently selected community cloud tab.
	55	+ sprintf(__('Community Cloud: %s', 'code-snippets'), currentTab.label)}</h1>
	56	+ </div>
67	57
68		- <hr className="wp-header-end" />
	58	+ <hr className="wp-header-end" />
69	59
70		- <p className="snippets-page-description">
71		- {__('Search the community cloud and download user-shared snippets directly to your site.', 'code-snippets')}
72		- </p>
	60	+ <p className="snippets-page-description">
	61	+ {__('Search the community cloud and download user-shared snippets directly to your site.', 'code-snippets')}
	62	+ </p>
	63	+ </>)}
73	64
74		- <TabContent />
	65	+ {(() => {
	66	+ switch (currentTab.name) {
	67	+ case 'snippets':
	68	+ return <CloudSearch snippetView={snippetView} setSnippetView={setSnippetView} />
	69	+
	70	+ case 'bundles':
	71	+ return <UpsellPage />
	72	+ }
	73	+ })()}
75	74	</>
76	75	)
77	76	}
78	77