save progress

Codeinwp · Oct 13, 2024 · 7d1616f · 7d1616f
1 parent 11e2971
commit 7d1616f
Show file tree

Hide file tree

Showing 3 changed files with 227 additions and 0 deletions.
diff --git a/src/backend/parts/data/SitemapCrawler.js b/src/backend/parts/data/SitemapCrawler.js
@@ -0,0 +1,114 @@
+/**
+ * WordPress dependencies.
+ */
+import { __ } from '@wordpress/i18n';
+
+import { capitalize } from 'lodash';
+
+import {
+	Button,
+	Panel,
+	PanelRow
+} from '@wordpress/components';
+
+/**
+ * Internal dependencies.
+ */
+import UpsellContainer from '../UpsellContainer';
+
+const posts = {
+	1: {
+		url: 'https://example.com/sitemap.xml',
+		status: 'queued'
+	},
+	2: {
+		url: 'https://example.com/sitemap.xml',
+		status: 'completed'
+	},
+	3: {
+		url: 'https://example.com/sitemap.xml',
+		status: 'completed'
+	}
+};
+
+const SitemapCrawler = ({ setView }) => {
+	return (
+		<>
+			<div className="col-span-6 xl:col-span-4">
+				<Panel>
+					<div className="items-center gap-4 flex shrink-0 h-12 px-4 py-0 border-b-[#ddd] border-b border-solid">
+						<Button
+							icon="arrow-left-alt"
+							hideLabel
+							label={ __( 'Back', 'hyve' ) }
+							onClick={ () => setView( null ) }
+						/>
+
+						<h3>{ __( 'Sitemap', 'hyve' ) }</h3>
+					</div>
+
+					<PanelRow>
+						<p className="py-4">{ __( 'Use this tool to crawl a website and add its content to the Knowledge Base using the sitemap.', 'hyve' ) }</p>
+
+						<div className="relative pt-4 pb-8 overflow-x-auto">
+							<UpsellContainer
+								title={ __( 'Sitemap Crawling is a Premium feature', 'hyve-lite' ) }
+								description={ __( 'Use this tool to crawl a website and add its content to the Knowledge Base using the sitemap. Upgrade now!', 'hyve-lite' ) }
+								campaign="sitemap-crawling-feature"
+							>
+								<div className="flex gap-4 pb-4 flex-col">
+
+									<div className="w-full flex justify-end">
+										<Button
+											variant="primary"
+											onClick={ () => {} }
+										>
+											{ __( 'Add Sitemap', 'hyve' ) }
+										</Button>
+									</div>
+								</div>
+
+								<div className="flex flex-col">
+									<div className="bg-gray-50 px-6 py-3 text-left text-xs text-gray-700 uppercase">
+										<div className="flex">
+											<div className="flex-1">{ __( 'Sitemap URL', 'hyve' ) }</div>
+											<div className="w-1/6">{ __( 'Status', 'hyve' ) }</div>
+											<div className="w-1/6 flex justify-center">{ __( 'Action', 'hyve' ) }</div>
+										</div>
+									</div>
+
+									<div className="flex flex-col">
+										{ Object.keys( posts ).map( ( post ) => (
+											<div
+												key={ post }
+												className="flex items-center bg-white px-6 py-4 border-b text-sm text-gray-500"
+											>
+												<div className="flex-1 text-left rtl:text-right overflow-hidden">
+													<span className="max-w-full text-ellipsis overflow-hidden">{ posts[ post ].url }</span>
+												</div>
+
+												<div className="w-1/6">{ capitalize( posts[ post ].status ) }</div>
+
+												<div className="w-1/6 flex justify-center">
+													<Button
+														onClick={ () => {} }
+														variant="secondary"
+														className="w-20 justify-center"
+													>
+														{ __( 'Details', 'hyve' ) }
+													</Button>
+												</div>
+											</div>
+										) )}
+									</div>
+								</div>
+							</UpsellContainer>
+						</div>
+					</PanelRow>
+				</Panel>
+			</div>
+		</>
+	);
+};
+
+export default SitemapCrawler;
diff --git a/src/backend/parts/data/URLCrawler.js b/src/backend/parts/data/URLCrawler.js
@@ -0,0 +1,109 @@
+/**
+ * WordPress dependencies.
+ */
+import { __ } from '@wordpress/i18n';
+
+import {
+	Button,
+	TextControl,
+	Panel,
+	PanelRow
+} from '@wordpress/components';
+
+/**
+ * Internal dependencies.
+ */
+import PostsTable from '../PostsTable';
+import UpsellContainer from '../UpsellContainer';
+
+const posts = [
+	{
+		id: 1,
+		title: 'https://example.com/page1'
+	},
+	{
+		id: 2,
+		title: 'https://example.com/page2'
+	},
+	{
+		id: 3,
+		title: 'https://example.com/page3'
+	},
+	{
+		id: 4,
+		title: 'https://example.com/page4'
+	},
+	{
+		id: 5,
+		title: 'https://example.com/page5'
+	}
+];
+
+const URLCrawler = ({ setView }) => {
+	return (
+		<>
+			<div className="col-span-6 xl:col-span-4">
+				<Panel>
+					<div className="items-center gap-4 flex shrink-0 h-12 px-4 py-0 border-b-[#ddd] border-b border-solid">
+						<Button
+							icon="arrow-left-alt"
+							hideLabel
+							label={ __( 'Back', 'hyve' ) }
+							onClick={ () => setView( null ) }
+						/>
+
+						<h3>{ __( 'Website URL', 'hyve' ) }</h3>
+					</div>
+
+					<PanelRow>
+						<p className="py-4">{ __( 'This page allows you to add URLs to the Knowledge Base. You can add URLs to the Knowledge Base by entering the URL in the field below and clicking the "Crawl URL" button.', 'hyve' ) }</p>
+
+						<div className="relative pt-4 pb-8 overflow-x-auto">
+							<UpsellContainer
+								title={ __( 'URL Crawling is a Premium feature', 'hyve-lite' ) }
+								description={ __( 'Use this tool to crawl a website and add its content to the Knowledge Base using the sitemap. Upgrade now!', 'hyve-lite' ) }
+								campaign="website-crawling-feature"
+							>
+								<div className="flex gap-4 pb-4 flex-col">
+									<div className="flex w-full items-end gap-4">
+										<TextControl
+											label={ __( 'Website URL', 'hyve' ) }
+											placeholder={ 'https://' }
+											type="url"
+											className="w-full"
+											value=""
+											onChange={ () => {} }
+										/>
+
+										<Button
+											variant="secondary"
+											onClick={ () => {} }
+										>
+											{ __( 'Crawl URL', 'hyve' ) }
+										</Button>
+									</div>
+								</div>
+
+								<PostsTable
+									posts={ posts || [] }
+									isLoading={ false }
+									hasMore={ false }
+									onFetch={ () => {} }
+									onAction={ () => {} }
+									isBusy={ [] }
+									actionProps={{
+										variant: 'secondary',
+										isDestructive: true
+									}}
+									actionLabel={ __( 'Delete', 'hyve' ) }
+								/>
+							</UpsellContainer>
+						</div>
+					</PanelRow>
+				</Panel>
+			</div>
+		</>
+	);
+};
+
+export default URLCrawler;
diff --git a/src/backend/route.js b/src/backend/route.js
@@ -22,6 +22,8 @@ import Posts from './parts/data/Posts';
 import Updated from './parts/data/Updated';
 import FailedModeration from './parts/data/FailedModeration';
 import Custom from './parts/data/Custom';
+import URLCrawler from './parts/data/URLCrawler';
+import SitemapCrawler from './parts/data/SitemapCrawler';
 import FAQ from './parts/data/FAQ';
 import Messages from './parts/Messages';
 import Qdrant from './parts/integrations/Qdrant';
@@ -127,12 +129,14 @@ export const KNOWLEDGE_BASE = {
 		label: __( 'Website URL', 'hyve-lite' ),
 		description: __( 'Crawl URLs to add content to the Knowledge Base.', 'hyve-lite' ),
 		icon: customLink,
+		component: URLCrawler,
 		isPro: true
 	},
 	sitemap: {
 		label: __( 'Sitemap', 'hyve-lite' ),
 		description: __( 'Add a sitemap to the Knowledge Base.', 'hyve-lite' ),
 		icon: blockMeta,
+		component: SitemapCrawler,
 		isPro: true
 	}
 };