adds new docs (#518)

README.md

@@ -33,13 +33,13 @@ the
 
 # Highlighted features
 
-- [Vector Search](https://docs.oramasearch.com/usage/search/vector-search)
-- [Search filters](https://docs.oramasearch.com/usage/search/filters)
-- [Geosearch](https://docs.oramasearch.com/usage/search/geosearch)
-- [Facets](https://docs.oramasearch.com/usage/search/facets)
-- [Fields Boosting](https://docs.oramasearch.com/usage/search/fields-boosting)
-- [Typo tolerance](https://docs.oramasearch.com/usage/search/introduction#typo-tolerance)
-- [Exact match](https://docs.oramasearch.com/usage/search/introduction#exact-match)
+- [Vector Search](https://docs.oramasearch.com/open-source/usage/search/vector-search)
+- [Search filters](https://docs.oramasearch.com/open-source/usage/search/filters)
+- [Geosearch](https://docs.oramasearch.com/open-source/usage/search/geosearch)
+- [Facets](https://docs.oramasearch.com/open-source/usage/search/facets)
+- [Fields Boosting](https://docs.oramasearch.com/open-source/usage/search/fields-boosting)
+- [Typo tolerance](https://docs.oramasearch.com/open-source/usage/search/introduction#typo-tolerance)
+- [Exact match](https://docs.oramasearch.com/open-source/usage/search/introduction#exact-match)
 - [Stemming and tokenization in 28 languages](https://docs.oramasearch.com/text-analysis/stemming)
 
 # Installation

packages/docs/components/DocCards/index.jsx

@@ -0,0 +1,62 @@
+import Link from 'next/link'
+import clx from 'classnames'
+import { useDark } from '../../hooks/useDark.js'
+import { BsArrowRightShort } from 'react-icons/bs'
+
+const docs = [
+  {
+    name: 'Open-Source Docs',
+    description: 'Documentation for Orama\'s open-source projects',
+    link: '/open-source'
+  },
+  {
+    name: 'Orama Cloud Docs',
+    description: 'Documentation and guides for Orama Cloud',
+    link: '/cloud'
+  }
+]
+
+const bgOSS = {
+  dark: 'radial-gradient(77.55% 79.46% at 5.73% 0%, #6A6279 0%, rgba(16, 17, 17, 0.00) 100%)',
+  light: 'radial-gradient(77.55% 79.46% at 5.73% 0%, #EBE8F0 0%, #FFF 100%)'
+}
+
+const bgCloud = {
+  dark: 'radial-gradient(77.55% 79.46% at 5.73% 0%, #4C3088 0%, rgba(16, 17, 17, 0.00) 100%)',
+  light: 'radial-gradient(77.55% 79.46% at 5.73% 0%, #D0A6F1 0%, rgba(255, 255, 255, 0.00) 100%)'
+}
+
+export function DocCards () {
+  const isDark = useDark()
+
+  return (
+    <div className='relative flex flex-col md:flex-row w-full'>
+      {docs.map((doc, index) => (
+        <Link href={doc.link} key={index}>
+          <div
+            className={clx('flex flex-col w-72 md:h-48 h-38 p-6 border dark:border-zinc-800 border-zinc-200 rounded-md transition-all ease-linear hover:shadow-xl hover:border-zinc-600', {
+              'md:mr-8': index === 0,
+              'md:ml-8 mt-4 md:mt-0': index === 1,
+            })}
+            style={{
+              background: index === 0 ? bgOSS[isDark ? 'dark' : 'light'] : bgCloud[isDark ? 'dark' : 'light']
+            }}
+          >
+            <h2 className='font-bold text-m dark:text-zinc-200 text-zinc-900'>
+              {doc.name}
+            </h2>
+            <p className={clx('text-xs dark:text-zinc-300 text-zinc-900 mt-1')}>
+              {doc.description}
+            </p>
+
+            <div className='flex justify-center relative w-full'>
+              <div className='transform md:translate-y-12 translate-y-4'>
+                <BsArrowRightShort className='dark:text-zinc-500 text-zinc-400 w-8 h-8' />
+              </div>
+            </div>
+          </div>
+        </Link>
+      ))}
+    </div>
+  )
+}

packages/docs/components/Navigation/index.jsx

@@ -0,0 +1,7 @@
+import { Navbar } from 'nextra-theme-docs'
+
+export function Navigation (props) {
+  return (
+    <Navbar {...props} />
+  )
+}

packages/docs/components/Screenshot/index.jsx

@@ -0,0 +1,11 @@
+import Image from 'next/image'
+import Zoom from 'react-medium-image-zoom'
+import 'react-medium-image-zoom/dist/styles.css'
+
+export function Screenshot({ src, alt }) {
+  return (
+    <Zoom>
+      <Image src={src} width={1280} height={720} alt={alt} className='nx-rounded-md nx-my-8 nx-border nx-border-neutral-200' />
+    </Zoom>
+  )
+}

packages/docs/hooks/useDark.js

@@ -0,0 +1,12 @@
+import { useState, useEffect } from 'react'
+import { useTheme } from 'next-themes'
+
+export const useDark = () => {
+  const { resolvedTheme } = useTheme()
+  const [isDark, setIsDark] = useState(false)
+  useEffect(() => {
+    setIsDark(resolvedTheme === 'dark')
+    return () => false
+  }, [resolvedTheme])
+  return isDark
+}

packages/docs/package.json

@@ -18,6 +18,7 @@
     "@orama/orama": "workspace:*",
     "@orama/plugin-match-highlight": "workspace:*",
     "@orama/plugin-nextra": "workspace:*",
+    "classnames": "^2.3.2",
     "next": "^13.3.0",
     "next-sitemap": "^4.2.3",
     "nextra": "^2.4.0",
@@ -26,6 +27,13 @@
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-icons": "^4.8.0",
+    "react-medium-image-zoom": "^5.1.8",
     "rehype-raw": "^6.1.1"
+  },
+  "devDependencies": {
+    "autoprefixer": "^10.4.16",
+    "install": "^0.13.0",
+    "postcss": "^8.4.31",
+    "tailwindcss": "^3.3.3"
   }
 }

packages/docs/pages/_app.jsx

@@ -1,4 +1,5 @@
 import Script from 'next/script'
+import '../styles.css'
 
 export default function App({ Component, pageProps }) {
   const googleAnalyticsID = process.env.NEXT_PUBLIC_GOOGLE_ANALYTICS_ID

packages/docs/pages/_meta.json

@@ -1,55 +1,21 @@
 {
-  "search-reference": {
-    "type": "menu",
-    "title": "Search Features",
-    "items": {
-      "vector-search": {
-        "title": "Vector Search",
-        "href": "/usage/search/vector-search"
-      },
-      "typo-tolerance": {
-        "title": "Typo Tolerance",
-        "href": "/usage/search/introduction#typo-tolerance"
-      },
-      "geosearch": {
-        "title": "Geosearch",
-        "href": "/usage/search/geosearch"
-      },
-      "exact-match": {
-        "title": "Exact Match",
-        "href": "/usage/search/introduction#exact-match"
-      },
-      "fields-boosting": {
-        "title": "Fields Boosting",
-        "href": "/usage/search/fields-boosting"
-      },
-      "facets": {
-        "title": "Facets",
-        "href": "/usage/search/facets"
-      },
-      "filters": {
-        "title": "Filters",
-        "href": "/usage/search/filters"
-      }
-    }
-  },
-  "nextra_link": {
-    "type": "page",
-    "title": "Slack Support ↗",
-    "href": "https://orama.to/slack",
-    "newWindow": true
+  "*": {
+    "type": "page"
   },
-  "--- Getting Started": {
-    "title": "Getting Started",
-    "type": "separator"
+  "index": {
+    "display": "hidden",
+    "theme": {
+      "layout": "full",
+      "sidebar": false,
+      "toc": false
+    }
   },
-  "index": "Introduction",
-  "usage": "Usage",
-  "--- Advanced": {
-    "title": "Advanced",
-    "type": "separator"
+  "open-source": {
+    "display": "hidden",
+    "title": "Open Source"
   },
-  "internals": "Internals",
-  "plugins": "Plugins",
-  "text-analysis": "Text Analysis"
-}
+  "cloud": {
+    "display": "hidden",
+    "title": "Cloud"
+  }
+}

packages/docs/pages/cloud/_meta.json

@@ -0,0 +1,27 @@
+{
+  "--- Orama Cloud": {
+    "title": "Orama Cloud",
+    "type": "separator"
+  },
+  "index": "Introduction",
+  "understanding-orama": "Understanding Orama",
+  "--- Guides": {
+    "title": "Guides",
+    "type": "separator"
+  },
+  "indexes": "Working with Indexes",
+  "data-sources": "Data Sources",
+  "integrating-orama-cloud": "Integrating Orama Cloud",
+  "slack_support": {
+    "type": "page",
+    "title": "Slack Support ↗",
+    "href": "https://orama.to/slack",
+    "newWindow": true
+  },
+  "oss_docs": {
+    "type": "page",
+    "title": "Open Source Docs",
+    "href": "https://docs.oramasearch.com",
+    "newWindow": false
+  }
+}

packages/docs/pages/cloud/data-sources/_meta.json

@@ -0,0 +1,4 @@
+{
+  "native-integrations": "Native integrations",
+  "custom": "Custom integrations"
+}

packages/docs/pages/cloud/data-sources/custom/_meta.json

@@ -0,0 +1,6 @@
+{
+  "rest-api": "REST API",
+  "webhook": "Webhook",
+  "csv-file": "CSV File",
+  "json-file": "JSON File"
+}

packages/docs/pages/cloud/data-sources/custom/csv-file.mdx

@@ -0,0 +1 @@
+# Import a CSV file to Orama Cloud

packages/docs/pages/cloud/data-sources/custom/json-file.mdx

@@ -0,0 +1 @@
+# Import a JSON file to Orama Cloud

packages/docs/pages/cloud/data-sources/custom/rest-api.mdx

@@ -0,0 +1 @@
+# Connect Orama Cloud to a REST API

packages/docs/pages/cloud/data-sources/custom/webhooks.mdx

@@ -0,0 +1 @@
+# Feed via WebHooks

packages/docs/pages/cloud/data-sources/native-integrations/_meta.json

@@ -0,0 +1,5 @@
+{
+  "introduction": "Introduction",
+  "shopify": "Shopify",
+  "docusaurus": "Docusaurus"
+}

packages/docs/pages/cloud/data-sources/native-integrations/docusaurus.mdx

@@ -0,0 +1 @@
+# Connect Orama Cloud to Docusaurus

packages/docs/pages/cloud/data-sources/native-integrations/introduction.mdx

@@ -0,0 +1,15 @@
+# Native Integrations
+
+With Orama, you can integrate with every external system, library, and API.
+
+While we let you build your own integrations via our **custom integrations** feature, we also provide a set of native integrations that you can use out of the box.
+
+At the time of writing this, we have the following native integrations:
+
+- [**Shopify**](/cloud/data-sources/native-integrations/shopify)
+- [**Docusaurus**](/cloud/data-sources/native-integrations/docusaurus) (Coming soon)
+- [**Nextra**](/cloud/data-sources/native-integrations/nextra) (Coming soon)
+
+When available, we suggest using native integrations over custom integrations, as they are highly optimized and provide a better developer experience, performance, and maintainability.
+
+We're working on adding more native integrations, so if you have any suggestions, please let us know at [info@oramasearch.com](mailto:info@oramasearch.com)!