Merge branch 'main' into api-ref

.github/workflows/jan-docs.yml

@@ -24,7 +24,7 @@ jobs:
       CLOUDFLARE_PROJECT_NAME: jan
     runs-on: ubuntu-latest
     permissions:
-      contents: read
+      contents: write
       deployments: write
       pull-requests: write
     steps:

docs/README.md

@@ -43,9 +43,9 @@ If you are using GitHub pages for hosting, this command is a convenient way to b
 
 ### Preview URL, Pre-release and Publishing Documentation
 
-When a PR is created, the preview URL will be automatically commented on the PR. For staging or pre-release documentation, use the following domains [https://pre-release.jan.ai/](https://pre-release.jan.ai/)
+When a PR is created, the preview URL will be automatically commented on the PR.
 
-To officially publish documentation, create a tag in the format `vx.y.z-docs` (e.g., `v0.1.1-docs`) on the `main` branch. The documentation will then be published to [https://jan.ai/](https://jan.ai/)
+The documentation will then be published to [https://jan.ai/](https://jan.ai/) when the PR is merged to `main`.
 
 ### Additional Plugins
 - @docusaurus/theme-live-codeblock

docs/docs/handbook/handbook.md

@@ -3,7 +3,6 @@ title: Onboarding Checklist
 slug: /handbook
 ---
 
-
 # Welcome
 
 Welcome to Jan! We’re really excited to bring you onboard.
@@ -46,9 +45,11 @@ Welcome to Jan! We’re really excited to bring you onboard.
 
 ### Apps you will need
 
-<aside> 💡 In order to feel connected in a remote workplace, we encourage you to add your profile photo to all the accounts.
+:::info
 
-</aside>
+💡 In order to feel connected in a remote workplace, we encourage you to add your profile photo to all the accounts.
+
+:::
 
 -   Company-wide
     -   [ ] Google:`[first_name]@jan.ai`
@@ -67,6 +68,3 @@ Welcome to Jan! We’re really excited to bring you onboard.
 -   Communications
     -   [ ] Fill in your contact details [here](https://docs.google.com/spreadsheets/d/1KAxya29_wb1bEESiFJeCrOec4pCG3uA2D4_VPgAn89U/edit#gid=0)
     -   [ ] To make sure everyone in the remote working environment understand more about each other, we encourage you to share your `How to work with me` in the [Drive Tab](https://docs.google.com/spreadsheets/d/1KAxya29_wb1bEESiFJeCrOec4pCG3uA2D4_VPgAn89U/edit#gid=0) under your name and the Discord `Internal` channel. 
-
-:::info UPDATING
-:::

docs/docs/install/windows.md

@@ -2,19 +2,58 @@
 title: Windows
 ---
 
-# Jan on Windows
+# Installing Jan on Windows
 
 ## Installation
-1. To download the lastest version of Jan on Windows, please visit the [Jan's homepage](https://jan.ai/).
+
-2. Once Jan installer (jan-win-x64-{version}.exe) is downloaded, run the installer. The installation process is expected to take around a minute.
+Jan is available for download via our homepage, [https://jan.ai](https://jan.ai/).
-3. By default, Jan is installed under this directory
+
+For Windows, the download should be available as a `.exe` file in the following format. 
+
 ```bash
+jan-win-x64-{version}.exe
+```
+
+The typical installation process takes around a minute. 
+
+### Github Releases
+
+Jan is also available from [Jan's Github Releases](https://github.com/janhq/jan/releases) page, with a recommended [latest stable release](https://github.com/janhq/jan/releases/latest). 
+
+Within the Releases' assets, you will find the following files for Windows:
+
+```bash
+# Windows Installers
+jan-win-x64-{version}.exe
+```
+
+### Default Installation Directory
+
+By default, Jan is installed in the following directory: 
+
+```bash
+# Default installation directory
 C:\Users\{username}\AppData\Local\Programs\Jan
 ```
-## Uninstall Jan
-If you have installed Jan on your Windows computer, either as a User or System installation, you can easily uninstall it by going to the Windows Control Panel. 
-In case you wish to completely remove all user data associated with Jan after uninstallation, you can delete the user data folders located at `%APPDATA%\Jan`. This will return your system to its state prior to the installation of Jan. This method can also be used to reset all settings if you are experiencing any issues with Jan.
 
-## Common Questions
+## Uninstalling Jan
-### Microsoft Defender SmartScreen prevented an unrecognized app from starting
+
-When initiating the Jan Installer, be aware that Windows Defender may display a warning. This warning is a standard security measure, as the installer will make changes to the system. To proceed with the installation, navigate through the warning options, typically found in "More info" section and select the appropriate option to continue with the installation.
+To uninstall Jan in Windows, use the [Windows Control Panel](https://support.microsoft.com/en-us/windows/uninstall-or-remove-apps-and-programs-in-windows-4b55f974-2cc6-2d2b-d092-5905080eaf98). 
+
+To remove all user data associated with Jan, you can delete the `/Jan` directory in Windows' [AppData directory](https://superuser.com/questions/632891/what-is-appdata).  
+
+```shell
+# Jan's User Data directory
+%AppData%\Jan
+``` 
+
+## Troubleshooting
+
+### Microsoft Defender
+
+**Error: "Microsoft Defender Smartscreen prevented an unrecognized app from starting"**
+
+Windows Defender may display the above warning when running the Jan Installer, as a standard security measure. 
+
+To proceed, select the "More info" option and select the "Run Anyway" option to continue with the installation.
+

docs/package.json

@@ -14,18 +14,18 @@
     "write-heading-ids": "docusaurus write-heading-ids"
   },
   "dependencies": {
-    "@docusaurus/core": "^2.4.3",
+    "@docusaurus/core": "^3.0.0",
-    "@docusaurus/preset-classic": "^2.4.3",
+    "@docusaurus/plugin-content-docs": "^3.0.0",
-    "@docusaurus/theme-live-codeblock": "^2.4.3",
+    "@docusaurus/preset-classic": "^3.0.0",
-    "@docusaurus/theme-mermaid": "^2.4.3",
+    "@docusaurus/theme-live-codeblock": "^3.0.0",
+    "@docusaurus/theme-mermaid": "^3.0.0",
     "@headlessui/react": "^1.7.17",
     "@heroicons/react": "^2.0.18",
-    "@mdx-js/react": "^1.6.22",
+    "@mdx-js/react": "^3.0.0",
     "@redocly/cli": "^1.4.1",
     "autoprefixer": "^10.4.16",
     "axios": "^1.5.1",
     "clsx": "^1.2.1",
-    "@docusaurus/plugin-content-docs": "2.4.3",
     "docusaurus-plugin-redoc": "^2.0.0",
     "docusaurus-plugin-sass": "^0.2.5",
     "docusaurus-theme-redoc": "^2.0.0",
@@ -41,7 +41,7 @@
     "tailwindcss": "^3.3.3"
   },
   "devDependencies": {
-    "@docusaurus/module-type-aliases": "2.4.1",
+    "@docusaurus/module-type-aliases": "^3.0.0",
     "dotenv": "^16.3.1",
     "tailwindcss-animate": "^1.0.7"
   },

docs/sidebars.js

@@ -25,9 +25,15 @@ const sidebars = {
     {
       type: "category",
       label: "Installation",
+      link: { type: "doc", id: "install/overview" },
       collapsible: true,
       collapsed: true,
-      items: ["install/overview","install/windows", "install/mac", "install/linux", "install/from-source"],
+      items: [
+        "install/windows",
+        "install/mac",
+        "install/linux",
+        "install/from-source",
+      ],
     },
     {
       type: "category",

web/containers/ModalCancelDownload/index.tsx

@@ -16,7 +16,6 @@ import {
 import { atom, useAtomValue } from 'jotai'
 
 import { useDownloadState } from '@/hooks/useDownloadState'
-import useGetPerformanceTag from '@/hooks/useGetPerformanceTag'
 
 import { formatDownloadPercentage } from '@/utils/converter'
 
@@ -30,7 +29,6 @@ export default function ModalCancelDownload({
   isFromList,
 }: Props) {
   const { modelDownloadStateAtom } = useDownloadState()
-  useGetPerformanceTag()
   const downloadAtom = useMemo(
     () => atom((get) => get(modelDownloadStateAtom)[suitableModel.name]),
     // eslint-disable-next-line react-hooks/exhaustive-deps

web/hooks/useGetPerformanceTag.ts

@@ -1,40 +1,37 @@
-import { useState } from 'react'
-
 import { ModelVersion } from '@janhq/core/lib/types'
-import { useAtomValue } from 'jotai'
 
 import { ModelPerformance, TagType } from '@/constants/tagType'
 
-import { totalRamAtom } from '@/helpers/atoms/SystemBar.atom'
-
 // Recommendation:
 // `Recommended (green)`: "Max RAM required" is 80% of users max  RAM.
 // `Slow on your device (yellow)`: Max RAM required is 80-100% of users max RAM
 // `Not enough RAM (red)`: User RAM is below "Max RAM required"
 
 export default function useGetPerformanceTag() {
-  const [performanceTag, setPerformanceTag] = useState<TagType | undefined>()
+  async function getPerformanceForModel(
-  const totalRam = useAtomValue(totalRamAtom)
+    modelVersion: ModelVersion,
-
+    totalRam: number
-  const getPerformanceForModel = async (modelVersion: ModelVersion) => {
+  ): Promise<{ title: string; performanceTag: TagType }> {
     const requiredRam = modelVersion.maxRamRequired
-    setPerformanceTag(calculateRamPerformance(requiredRam, totalRam))
+    const performanceTag = calculateRamPerformance(requiredRam, totalRam)
+
+    let title = ''
+
+    switch (performanceTag) {
+      case ModelPerformance.PerformancePositive:
+        title = 'Recommended'
+        break
+      case ModelPerformance.PerformanceNeutral:
+        title = 'Slow on your device'
+        break
+      case ModelPerformance.PerformanceNegative:
+        title = 'Not enough RAM'
+        break
+    }
+    return { title, performanceTag }
   }
 
-  let title = ''
+  return { getPerformanceForModel }
-  switch (performanceTag) {
-    case ModelPerformance.PerformancePositive:
-      title = 'Recommended'
-      break
-    case ModelPerformance.PerformanceNeutral:
-      title = 'Slow on your device'
-      break
-    case ModelPerformance.PerformanceNegative:
-      title = 'Not enough RAM'
-      break
-  }
-
-  return { performanceTag, title, getPerformanceForModel }
 }
 
 const calculateRamPerformance = (

web/screens/ExploreModels/ExploreModelItemHeader/index.tsx

@@ -1,5 +1,5 @@
 /* eslint-disable react-hooks/exhaustive-deps */
-import { useCallback, useEffect, useMemo } from 'react'
+import { useCallback, useEffect, useMemo, useState } from 'react'
 
 import { ModelCatalog, ModelVersion } from '@janhq/core/lib/types'
 import { Badge, Button } from '@janhq/uikit'
@@ -20,6 +20,8 @@ import { useMainViewState } from '@/hooks/useMainViewState'
 
 import { toGigabytes } from '@/utils/converter'
 
+import { totalRamAtom } from '@/helpers/atoms/SystemBar.atom'
+
 type Props = {
   suitableModel: ModelVersion
   exploreModel: ModelCatalog
@@ -32,8 +34,12 @@ const ExploreModelItemHeader: React.FC<Props> = ({
   const { downloadModel } = useDownloadModel()
   const { downloadedModels } = useGetDownloadedModels()
   const { modelDownloadStateAtom, downloadStates } = useDownloadState()
-  const { performanceTag, title, getPerformanceForModel } =
+  const { getPerformanceForModel } = useGetPerformanceTag()
-    useGetPerformanceTag()
+  const [title, setTitle] = useState<string>('Recommended')
+  const totalRam = useAtomValue(totalRamAtom)
+  const [performanceTag, setPerformanceTag] = useState<TagType>(
+    ModelPerformance.PerformancePositive
+  )
   const downloadAtom = useMemo(
     () => atom((get) => get(modelDownloadStateAtom)[suitableModel.name]),
     [suitableModel.name]
@@ -41,9 +47,20 @@ const ExploreModelItemHeader: React.FC<Props> = ({
   const downloadState = useAtomValue(downloadAtom)
   const { setMainViewState } = useMainViewState()
 
+  const calculatePerformance = useCallback(
+    (suitableModel: ModelVersion) => async () => {
+      const { title, performanceTag } = await getPerformanceForModel(
+        suitableModel,
+        totalRam
+      )
+      setPerformanceTag(performanceTag)
+      setTitle(title)
+    },
+    [totalRam]
+  )
+
   useEffect(() => {
-    getPerformanceForModel(suitableModel)
+    calculatePerformance(suitableModel)
-    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [suitableModel])
 
   const onDownloadClick = useCallback(() => {