Merge pull request #280 from janhq/fix-264

docs: update per v0.1.3

README.md

@@ -20,63 +20,62 @@
 
 > ⚠️ **Jan is currently in Development**: Expect breaking changes and bugs!
 
-Jan lets you run AI on your own hardware, with helpful tools to manage models and monitor your hardware performance.
+**Use offline LLMs with your own data.** Run open source models like Llama2 or Falcon on your internal computers/servers.
 
-In the background, Jan runs [Nitro](https://nitro.jan.ai), a C++ inference engine. It runs various model formats (GGUF/TensorRT) on various hardware (Mac M1/M2/Intel, Windows, Linux, and datacenter-grade Nvidia GPUs) with optional GPU acceleration.
+**Jan runs on any hardware.** From PCs to multi-GPU clusters, Jan supports universal architectures:
 
-> See the Nitro codebase at https://nitro.jan.ai.
+- [x] Nvidia GPUs (fast)
+- [x] Apple M-series (fast)
+- [x] Apple Intel
+- [x] Linux Debian
+- [x] Windows x64
 
-<!-- TODO: uncomment this later when we have this feature -->
+> Download Jan at https://jan.ai/
-<!-- Jan can be run as a server or cloud-native application for enterprise. We offer enterprise plugins for LDAP integration and Audit Logs. Contact us at [hello@jan.ai](mailto:hello@jan.ai) for more details. -->
 
 ## Demo
 
 <p align="center">
-  <img style='border:1px solid #000000' src="https://github.com/janhq/jan/assets/69952136/1f9bb48c-2e70-4633-9f68-7881cd925972" alt="Jan Web GIF">
+  <img style='border:1px solid #000000' src="https://github.com/janhq/jan/assets/69952136/1db9c3d3-79b1-4988-afb5-afd4f4afd0d9" alt="Jan Web GIF">
 </p>
 
+_Screenshot: Jan v0.1.3 on Mac M1 Pro, 16GB Sonoma_
+
 ## Quicklinks
 
-- Developer documentation: https://jan.ai/docs (Work in Progress)
+- [Developer docs](https://jan.ai/docs) (WIP)
-- Desktop app: Download at https://jan.ai/
+- Mobile App shell: [App Store](https://apps.apple.com/us/app/jan-on-device-ai-cloud-ais/id6449664703) | [Android](https://play.google.com/store/apps/details?id=com.jan.ai)
-- Mobile app shell: Download via [App Store](https://apps.apple.com/us/app/jan-on-device-ai-cloud-ais/id6449664703) | [Android](https://play.google.com/store/apps/details?id=com.jan.ai)
+- [Nitro Github](https://nitro.jan.ai): Jan's AI engine
-- Nitro (C++ AI Engine): https://nitro.jan.ai
 
 ## Plugins
 
 Jan supports core & 3rd party extensions:
 
 - [x] **LLM chat**: Self-hosted Llama2 and LLMs
-- [x] **Model Manager**: 1-click to install, swap, and delete models
+- [x] **Model Manager**: 1-click to install, swap, and delete models with HuggingFace integration
-- [x] **Storage**: Optionally store your conversation history and other data in SQLite/your storage of choice
+- [x] **Storage**: Optionally save conversation history and other data in SQLite
 - [ ] **3rd-party AIs**: Connect to ChatGPT, Claude via API Key (in progress)
 - [ ] **Cross device support**: Mobile & Web support for custom shared servers (in progress)
-- [ ] **File retrieval**: User can upload private and run a vectorDB (planned)
+- [ ] **File retrieval**: User can chat with docs
 - [ ] **Multi-user support**: Share a single server across a team/friends (planned)
 - [ ] **Compliance**: Auditing and flagging features (planned)
 
-## Hardware Support
+## Nitro (Jan's AI engine)
 
-Nitro provides both CPU and GPU support, via [llama.cpp](https://github.com/ggerganov/llama.cpp) and [TensorRT](https://github.com/NVIDIA/TensorRT), respectively.
+In the background, Jan runs [Nitro](https://nitro.jan.ai), an open source, C++ inference engine. It runs various model formats (GGUF/TensorRT) on various hardware (Mac M1/M2/Intel, Windows, Linux, and datacenter-grade Nvidia GPUs) with optional GPU acceleration.
 
-- [x] Nvidia GPUs (accelerated)
+> See the open source Nitro codebase at https://nitro.jan.ai.
-- [x] Apple M-series (accelerated)
-- [x] Linux DEB
-- [x] Windows x64
-
-Not supported yet: Apple Intel, Linux RPM, Windows x86|ARM64, AMD ROCm
-
-> See [developer docs](https://docs.jan.ai/docs/) for detailed installation instructions.
 
 ## Contributing
 
 Contributions are welcome! Please read the [CONTRIBUTING.md](CONTRIBUTING.md) file
 
 ### Pre-requisites
+
 - node >= 20.0.0
 - yarn >= 1.22.0
 
 ### Use as complete suite (in progress)
+
 ### For interactive development
 
 Note: This instruction is tested on MacOS only.
@@ -98,28 +97,29 @@ Note: This instruction is tested on MacOS only.
    yarn build:plugins
    ```
 
-4. **Run development and Using Jan Desktop**
+3. **Run development and Using Jan Desktop**
 
    ```
    yarn dev
    ```
+
    This will start the development server and open the desktop app.
    In this step, there are a few notification about installing base plugin, just click `OK` and `Next` to continue.
 
 ### For production build
 
-   ```bash
+```bash
-   # Do step 1 and 2 in previous section
+# Do step 1 and 2 in previous section
-   git clone https://github.com/janhq/jan
+git clone https://github.com/janhq/jan
-   cd jan
+cd jan
-   yarn install
+yarn install
-   yarn build:plugins
+yarn build:plugins
 
-   # Build the app
+# Build the app
-   yarn build
+yarn build
-   ```
+```
 
-   This will build the app MacOS m1/m2 for production (with code signing already done) and put the result in `dist` folder.
+This will build the app MacOS m1/m2 for production (with code signing already done) and put the result in `dist` folder.
 
 ## License
 

docs/src/components/Elements/dropdown.js

@@ -3,25 +3,25 @@ import { Fragment } from "react";
 import { Menu, Transition } from "@headlessui/react";
 import { ChevronDownIcon } from "@heroicons/react/20/solid";
 
-const items = [
+const systems = [
   {
     name: "Download for Mac (M1/M2)",
-    href: "https://github.com/janhq/jan/releases/download/v0.1.2/Jan-0.1.2-arm64.dmg",
+    href: "https://github.com/janhq/jan/releases/download/v0.1.3/jan-electron-mac-arm64-0.1.3.dmg",
     logo: require("@site/static/img/apple-logo-white.png").default,
   },
   {
     name: "Download for Mac (Intel)",
-    href: "https://github.com/janhq/jan/releases/download/v0.1.2/Jan-0.1.2-arm64.dmg",
+    href: "https://github.com/janhq/jan/releases/download/v0.1.3/jan-electron-mac-x64-0.1.3.dmg",
     logo: require("@site/static/img/apple-logo-white.png").default,
   },
   {
     name: "Download for Windows",
-    href: "https://static.vecteezy.com/system/resources/previews/004/243/615/non_2x/creative-coming-soon-teaser-background-free-vector.jpg",
+    href: "https://github.com/janhq/jan/releases/download/v0.1.3/jan-electron-win-x64-0.1.3.exe",
     logo: require("@site/static/img/windows-logo-white.png").default,
   },
   {
     name: "Download for Linux",
-    href: "https://static.vecteezy.com/system/resources/previews/004/243/615/non_2x/creative-coming-soon-teaser-background-free-vector.jpg",
+    href: "https://github.com/janhq/jan/releases/download/v0.1.3/jan-electron-linux-amd64-0.1.3.deb",
     logo: require("@site/static/img/linux-logo-white.png").default,
   },
 ];
@@ -31,19 +31,32 @@ function classNames(...classes) {
 }
 
 export default function Dropdown() {
+  const uAgent = window.navigator.userAgent;
+  let defaultSystem;
+
+  if (uAgent.indexOf("Win") !== -1) {
+    defaultSystem = systems[2];
+  } else if (uAgent.indexOf("Mac") !== -1) {
+    // Note: There's no way to detect ARM architecture from browser. Hardcoding to M1/M2 for now.
+    defaultSystem = systems[0];
+  } else if (uAgent.indexOf("Linux") !== -1) {
+    defaultSystem = systems[3];
+  } else {
+    defaultSystem = systems[0];
+  }
+
   return (
     <div className="inline-flex align-items-stretch">
-      {/* TODO dynamically detect users OS through browser */}
       <a
         className="cursor-pointer relative inline-flex items-center rounded-l-md border-0 px-3.5 py-2.5 text-base font-semibold text-white bg-indigo-600 dark:bg-indigo-500 hover:bg-indigo-500 dark:hover:bg-indigo-400 hover:text-white"
-        href={items[0].href}
+        href={defaultSystem.href}
       >
         <img
           src={require("@site/static/img/apple-logo-white.png").default}
           alt="Logo"
           className="h-5 mr-3 -mt-1"
         />
-        Download for Mac (Silicon)
+        {defaultSystem.name}
       </a>
       <Menu as="div" className="relative -ml-px block">
         <Menu.Button className="cursor-pointer relative inline-flex items-center rounded-r-md border-0 border-l border-gray-300 active:border-l active:border-white h-full text-white bg-indigo-600 dark:bg-indigo-500 hover:bg-indigo-500 dark:hover:bg-indigo-400">
@@ -61,11 +74,11 @@ export default function Dropdown() {
         >
           <Menu.Items className="absolute right-0 z-10 mt-2 w-72 text-left origin-top-right rounded-md bg-indigo-600 dark:bg-indigo-500 shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none">
             <div className="py-1">
-              {items.map((item) => (
+              {systems.map((system) => (
-                <Menu.Item key={item.name}>
+                <Menu.Item key={system.name}>
                   {({ active }) => (
                     <a
-                      href={item.href}
+                      href={system.href}
                       className={classNames(
                         active
                           ? "bg-indigo-500 dark:hover:bg-indigo-400 hover:text-white"
@@ -74,11 +87,11 @@ export default function Dropdown() {
                       )}
                     >
                       <img
-                        src={item.logo}
+                        src={system.logo}
                         alt="Logo"
                         className="w-3 mr-3 -mt-1"
                       />
-                      {item.name}
+                      {system.name}
                     </a>
                   )}
                 </Menu.Item>

docs/src/components/Homepage/downloads.js

@@ -5,7 +5,7 @@ import {
   LockClosedIcon,
 } from "@heroicons/react/20/solid";
 
-const features = [
+const systems = [
   {
     name: "Mac",
     description:
@@ -47,20 +47,20 @@ export default function HomepageDownloads() {
         </div>
         <div className="mx-auto mt-16 max-w-2xl sm:mt-20 lg:mt-24 lg:max-w-none">
           <dl className="grid max-w-xl grid-cols-1 gap-x-8 gap-y-16 lg:max-w-none lg:grid-cols-3">
-            {features.map((feature) => (
+            {systems.map((system) => (
-              <div key={feature.name} className="flex flex-col">
+              <div key={system.name} className="flex flex-col">
                 <dt className="flex items-center gap-x-3 text-base font-semibold leading-7 text-gray-900 dark: text-white">
-                  <feature.icon
+                  <system.icon
                     className="h-5 w-5 flex-none text-indigo-600 dark:text-indigo-400"
                     aria-hidden="true"
                   />
-                  {feature.name}
+                  {system.name}
                 </dt>
                 <dd className="mt-4 flex flex-auto flex-col text-base leading-7 text-gray-600 dark:text-gray-300">
-                  <p className="flex-auto">{feature.description}</p>
+                  <p className="flex-auto">{system.description}</p>
                   <p className="mt-6">
                     <a
-                      href={feature.href}
+                      href={system.href}
                       className="text-sm font-semibold leading-6 text-indigo-600 dark:text-indigo-400"
                     >
                       Learn more <span aria-hidden="true">→</span>

docs/src/components/Homepage/hero.js

@@ -8,7 +8,7 @@ export default function HomepageHero() {
 
   return (
     <div className="bg-white dark:bg-gray-900">
-      <div className="relative isolate pt-14">
+      <div className="relative isolate md:pt-14 pt-0">
         {/* Background top gradient styling */}
         {colorMode === "dark" ? (
           <div
@@ -39,7 +39,7 @@ export default function HomepageHero() {
         )}
 
         {/* Main hero block */}
-        <div className="py-24 sm:py-32 lg:pb-40 animate-in fade-in zoom-in-50 duration-1000 ">
+        <div className="py-24 lg:pb-40 animate-in fade-in zoom-in-50 duration-1000 ">
           <div className="mx-auto max-w-7xl px-6 lg:px-8">
             {/* Hero text and buttons */}
             <div className="mx-auto max-w-2xl text-center">
@@ -79,14 +79,15 @@ export default function HomepageHero() {
               src={
                 colorMode === "dark"
                   ? // TODO replace with darkmode image
-                    require("@site/static/img/desktop-llm-chat-dark.png").default
+                    require("@site/static/img/desktop-llm-chat-dark.png")
-                  : require("@site/static/img/desktop-llm-chat-light.png").default
+                      .default
+                  : require("@site/static/img/desktop-llm-chat-light.png")
+                      .default
               }
               alt="App screenshot"
               width={2432}
               className="mt-16 rounded-lg md:rounded-2xl lg:rounded-3xl bg-white/5 shadow-2xl ring-1 ring-white/10 sm:mt-24"
             />
-            
           </div>
         </div>
         {/* Background top gradient styling */}