Skip to content

Commit

Permalink
feat: added README_CN file. change default model to Claude 3.5 Sonnet
Browse files Browse the repository at this point in the history
  • Loading branch information
zhu-xiaowei committed Nov 15, 2024
1 parent e34fb00 commit 50889e8
Show file tree
Hide file tree
Showing 4 changed files with 227 additions and 28 deletions.
10 changes: 6 additions & 4 deletions .github/workflows/release.yml
Original file line number Diff line number Diff line change
@@ -1,10 +1,12 @@
name: Release Template

on:
push:
branches: [ "main" ]
pull_request:
branches: [ "main" ]
workflow_dispatch:
inputs:
reason:
description: 'the reason for triggering this workflow'
required: false
default: 'manually publish the ecr images and templates'
jobs:
release_template:
runs-on: ubuntu-latest
Expand Down
74 changes: 52 additions & 22 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,3 +1,5 @@
[中文](/README_CN.md)

# SwiftChat - A Cross-platform AI Chat App

SwiftChat is a fast and responsive AI chat application built with React Native and powered by Amazon Bedrock. Featuring
Expand All @@ -24,22 +26,24 @@ generation across Android, iOS, and macOS platforms.
By default, we use AWS App Runner, which is commonly used to host Python FastAPI servers, offering high performance,
scalability and low latency.

Alternatively, we provide the option to replace App Runner with AWS Lambda using Function URLs for a more cost-effective
Alternatively, we provide the option to replace App Runner with AWS Lambda using Function URL for a more cost-effective
solution, as shown in
this [example](https://github.com/awslabs/aws-lambda-web-adapter/tree/main/examples/fastapi-response-streaming).

## Getting Started

### Step 1: Set up your API Key

1. Click <a href="https://console.aws.amazon.com/systems-manager/parameters/" target="_blank">Parameter Store</a> to open your AWS Console.
1. Right-click [Parameter Store](https://console.aws.amazon.com/systems-manager/parameters/) to open your AWS Console in
new window.
2. Check whether you are in the [supported region](#supported-region), then click on the "Create parameter" button.
3. Name: Enter a descriptive name for your parameter (e.g., "SwiftChatAPIKey").
3. Name: Enter a descriptive name for your parameter (e.g., "SwiftChatAPIKey", this is `ApiKeyParam` you will fill
in [Step2](#step-2-deploy-stack-and-get-your-api-url)).
4. Tier: Select **Standard**.
5. Type: Select **SecureString**.
6. Value: Any string without spaces (This value is your API Key which should fill in your App's Settings page).
6. Value: Any string without spaces (This is the API Key you'll need to configure your App
in [Step 3](#step-3-download-the-app-and-setup-with-api-url-and-api-key)).
7. Click "Create parameter".
8. Make a note of the parameter name you used (e.g., "SwiftChatAPIKey"). You'll need this in the next step.

### Step 2: Deploy stack and get your API URL

Expand All @@ -48,7 +52,7 @@ this [example](https://github.com/awslabs/aws-lambda-web-adapter/tree/main/examp

[![Launch Stack](images/launch-stack.png)](https://console.aws.amazon.com/cloudformation/home#/stacks/create/template?stackName=SwiftChatAPI&templateURL=https://aws-gcr-solutions.s3.amazonaws.com/swift-chat/latest/SwiftChatAppRunner.template)

- Lambda (You need to config your Lambda Function URL manually)
- Lambda (Requires manual setup of Function URL with NONE auth)

[![Launch Stack](images/launch-stack.png)](https://console.aws.amazon.com/cloudformation/home#/stacks/create/template?stackName=SwiftChatAPI&templateURL=https://aws-gcr-solutions.s3.amazonaws.com/swift-chat/latest/SwiftChatLambda.template)

Expand All @@ -59,33 +63,36 @@ this [example](https://github.com/awslabs/aws-lambda-web-adapter/tree/main/examp
acknowledge that AWS CloudFormation might create IAM resources" checkbox at the bottom.
4. Click **Next**, In the "Review and create" Review your configuration and click **Submit**.

Wait about 3-5 minutes for the deployment to finish.
Wait about 3-5 minutes for the deployment to finish, and get your API URL:

**For using App Runner**, click the CloudFormation stack and go to Outputs tab, you can find the **API URL**
**For App Runner**, click the CloudFormation stack and go to **Outputs** tab, you can find the **API URL**
(which looks like `https://xxx.xxx.awsapprunner.com`)

**For using Lambda**, follow these steps to get your **API URL** by enabling Lambda Function URL manually:
**For Lambda**, follow these steps to get your **API URL**:

1. Click the CloudFormation stack and go to **Resources** tab
2. Expand APIHandler under Physical ID, click the Lambda link to open Lambda page
3. In Lambda page, go to **Configuration** -> **Function URL** to enable Lambda Function URL with **RESPONSE_STREAM**
invoke mode
4. You'll find your Lambda Function URL like `https://xxx.lambda-url.xxx.on.aws` - use this as your **API URL**
1. Find your Lambda function in CloudFormation -> **Resources** -> APIHandler
2. Click to open the Lambda function (`SwiftChatLambda-xxx`)
3. Set up Function URL:
- Go to **Configuration** -> **Function URL**, Click **Create function URL**
- Select: **Auth type**: `NONE`
- Enable: **Invoke mode**: `RESPONSE_STREAM` under Additional settings
4. Click Save to get your API URL (`https://xxx.lambda-url.xxx.on.aws`)
5. Note: We use Bearer Token for API security verification. You can upgrade to `AWS_IAM` Auth type manually.

### Step 3: Download the app and setup with API URL and API Key

1. Download the App
- Android App [Download](https://github.com/aws-samples/swift-chat/releases/download/v1.5.0/SwiftChat.apk)
- macOS App [Download](https://github.com/aws-samples/swift-chat/releases/download/v1.5.0/SwiftChat.dmg)
- Android App click to [Download](https://github.com/aws-samples/swift-chat/releases/download/v1.5.0/SwiftChat.apk)
- macOS App click to [Download](https://github.com/aws-samples/swift-chat/releases/download/v1.5.0/SwiftChat.dmg)
- iOS (Currently we do not provide the iOS version, you can build it locally with Xcode)

2. Launch your App, Click the menu button in the top left to open the drawer page, click **Settings** in the bottom of
the drawer.
3. Paste the API URL and API Key then select the Region.
4. You can change the default text and image model, and **make sure you have enabled these models in your AWS console**.
2. Launch your App, click the left menu button to open the drawer page, click **Settings** in the bottom of the drawer.
3. Paste the `API URL` and `API Key` then select the Region.
4. You can change the default text and image model, and **make sure these models are enabled in the corresponding Region
in the AWS Console**.
5. Click the top right finish icon to save your configuration and start your chat.

Congratulations! Your SwiftChat App is ready to use 🎉
Congratulations 🎉 Your SwiftChat App is ready to use!

### Supported Region

Expand All @@ -101,7 +108,30 @@ Congratulations! Your SwiftChat App is ready to use 🎉
- Europe (Paris): eu-west-3
- South America (São Paulo): sa-east-1

## Why Swift?
## What Makes SwiftChat Really "Swift"?

🚀 **Fast Launch Speed**

- Thanks to the **AOT** (Ahead of Time) compilation of RN Hermes engine
- Added **lazy loading** of complex components
- App can start and be ready for input **within 1 second**

🌐 **Fast Request Speed**

- Speed up end-to-end API requests through **image compression**
- Deploying APIs in the **same region** as Bedrock provides lower latency
- Minimal response payload with **zero parsing** needed for direct display

📱 **Fast Render Speed**

- Using `useMemo` and custom caching to creates secondary cache for session content
- Reduce unnecessary re-renders and speed up streaming messages display
- All UI components are rendered as **native components**

📦 **Fast Storage Speed**

- By using **react-native-mmkv** Messages can be read, stored, and updated **10x faster** than AsyncStorage
- Optimized session content and session list storage structure to accelerates history list display

## App Privacy & Security

Expand Down
167 changes: 167 additions & 0 deletions README_CN.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,167 @@
[English](/README.md)

# SwiftChat - 跨平台 AI 聊天应用

SwiftChat是一个使用 React Native 构建并由 Amazon Bedrock 提供支持的快速响应式AI聊天应用。它采用极简设计理念和强大的隐私保护,提供实时流式对话和AI图像生成功能,支持
Android、iOS 和 macOS 等多个平台。

![](images/promo.png)

**主要特点:**

- 与 AI 进行实时流式聊天
- AI 图像生成
- 跨平台支持(Android、iOS、macOS)
- 针对 iPad 和 Android 平板电脑优化
- 快速启动和响应性能
- 支持多种 AI 模型及切换
- 使用 React Native 构建
- 由 Amazon Bedrock 提供支持

## 架构

![](/images/architecture.png)

默认情况下,我们使用 AWS App Runner(通常用于托管 Python FastAPI 服务器),提供高性能、可扩展性和低延迟。

另外,我们提供使用 AWS Lambda 的 Function URL 替代 App Runner
的选项,以获得更具成本效益的解决方案,如 [示例](https://github.com/awslabs/aws-lambda-web-adapter/tree/main/examples/fastapi-response-streaming)
所示。

## 入门指南

### 第1步: 设置API Key

1. 右键点击 [Parameter Store](https://console.aws.amazon.com/systems-manager/parameters/) 在新窗口中打开AWS控制台。
2. 检查您是否在 [支持的区域](#支持的区域),然后点击"创建参数"按钮。
3. 名称:为您的参数输入描述性名称(例如"SwiftChatAPIKey",这是您将在 [第2步](#第2步-部署堆栈并获取api-url)
中填写的`ApiKeyParam`)。
4. 层级:选择 **标准**
5. 类型:选择 **SecureString**
6. 值:任何不含空格的字符串(这是您需要在 [第3步](#第3步-下载应用并设置-api-url-和-api-key) 中配置 App 的 API Key)。
7. 点击"创建参数"。

### 第2步: 部署堆栈并获取API URL

1. 点击以下按钮在与刚才创建的 API Key 相同的区域启动 CloudFormation 堆栈。
- App Runner

[![启动堆栈](images/launch-stack.png)](https://console.aws.amazon.com/cloudformation/home#/stacks/create/template?stackName=SwiftChatAPI&templateURL=https://aws-gcr-solutions.s3.amazonaws.com/swift-chat/latest/SwiftChatAppRunner.template)

- Lambda (需要手动设置无认证的 Function URL)

[![启动堆栈](images/launch-stack.png)](https://console.aws.amazon.com/cloudformation/home#/stacks/create/template?stackName=SwiftChatAPI&templateURL=https://aws-gcr-solutions.s3.amazonaws.com/swift-chat/latest/SwiftChatLambda.template)

2. 点击**下一步**,在"指定堆栈详细信息"页面中提供以下信息:
- 使用存储 API Key 的参数名填写`ApiKeyParam`(例如"SwiftChatAPIKey")。
- 对于App Runner,根据您的需求选择`InstanceTypeParam`
3. 点击**下一步**,保持"配置堆栈选项"页面默认设置,阅读功能并勾选底部的"我确认,AWS CloudFormation可能会创建 IAM 资源"复选框。
4. 点击**下一步**,在"审核并创建"中检查配置并点击**提交**

等待约3-5分钟部署完成,然后获取 API URL:

**对于使用 App Runner**,点击CloudFormation堆栈并转到**输出**选项卡,您可以找到**API URL**(
类似`https://xxx.xxx.awsapprunner.com`)

**对于使用 Lambda**,按照以下步骤获取**API URL**:

1. 在 CloudFormation -> **资源** -> APIHandler中找到您的Lambda函数
2. 点击打开 Lambda 函数(`SwiftChatLambda-xxx`)
3. 设置 Function URL:
- 转到 **配置** -> **函数 URL**,点击**创建函数 URL**
- 选择: **授权类型**: `NONE`
- 启用: **调用模式**: 在其他设置下选择`RESPONSE_STREAM`
4. 点击保存获取API URL(`https://xxx.lambda-url.xxx.on.aws`)
5. 注意: 我们默认使用 Bearer Token 进行 API 安全验证。您可以手动升级到`AWS_IAM`认证类型。

### 第3步: 下载应用并设置 API URL 和 API Key

1. 下载应用
- Android 应用点击 [下载](https://github.com/aws-samples/swift-chat/releases/download/v1.5.0/SwiftChat.apk)
- macOS 应用点击 [下载](https://github.com/aws-samples/swift-chat/releases/download/v1.5.0/SwiftChat.dmg)
- iOS (目前不提供 iOS 版本,您可以使用 Xcode 在本地构建)

2. 启动应用,点击左侧菜单按钮打开抽屉页面,点击抽屉底部的**Settings**
3. 粘贴`API URL``API Key`然后选择 Region。
4. 您可以更改默认的文本和图像模型,并**确保已在 AWS 控制台的对应 Region 中启用了这些模型**
5. 点击右上角对勾图标保存配置并开始聊天。

恭喜🎉 您的 SwiftChat 应用已准备就绪!

### 支持的区域

- 美国东部(弗吉尼亚北部):us-east-1
- 美国西部(俄勒冈):us-west-2
- 亚太地区(孟买):ap-south-1
- 亚太地区(新加坡):ap-southeast-1
- 亚太地区(悉尼):ap-southeast-2
- 亚太地区(东京):ap-northeast-1
- 加拿大(中部):ca-central-1
- 欧洲(法兰克福):eu-central-1
- 欧洲(伦敦):eu-west-2
- 欧洲(巴黎):eu-west-3
- 南美洲(圣保罗):sa-east-1

## 是什么让SwiftChat如此"迅速"?

🚀 **快速启动速度**

- 得益于RN Hermes 引擎的 **AOT**(提前编译)
- 添加复杂组件的 **延迟加载**
- 应用可以在 **1秒内** 启动并准备好接收输入

🌐 **快速请求速度**

- 通过**图像压缩**加速端到端 API 请求
- 在与 Bedrock **相同区域**部署 API 以提供更低延迟
- 最小响应有效负载,**零解析**直接显示

📱 **快速渲染速度**

- 使用`useMemo`和自定义缓存为会话内容创建二级缓存
- 减少不必要的重新渲染并加快流式消息显示
- 所有 UI 组件都渲染为**原生组件**

📦 **快速存储速度**

- 通过使用 **react-native-mmkv** 消息可以比 AsyncStorage **快10倍**读取、存储和更新
- 优化会话内容和会话列表存储结构以加快历史记录列表显示

## 应用隐私和安全

- 加密 API Key 的存储
- 最小权限要求
- 仅本地数据存储
- 无用户行为跟踪
- 无数据收集
- 隐私优先策略

## 构建和开发

首先,克隆此仓库并运行`npm i`下载依赖项。

### 构建 Android

```bash
npm run start && npm run android
```

## 构建 iOS

```bash
npm run start && npm run ios
```

### 构建 macOS

1.`/src/App.tsx` 中将 `isMac` 修改为 `true` 并执行 `npm run start`
2. 双击 `ios/SwiftChat.xcworkspace` 在 Xcode 中打开项目。
3. 将构建目标更改为 `My Mac (Mac Catalyst)` 然后点击 ▶ 运行按钮。

## 安全

更多信息请参见 [CONTRIBUTING](CONTRIBUTING.md#security-issue-notifications)

## 许可证

该库使用 MIT-0 许可证。详见 [LICENSE](/LICENSE) 文件。
4 changes: 2 additions & 2 deletions src/storage/StorageUtils.ts
Original file line number Diff line number Diff line change
Expand Up @@ -180,8 +180,8 @@ export function getTextModel(): Model {
export function getDefaultTextModels() {
return [
{
modelName: 'Claude 3.5 Sonnet v2',
modelId: 'anthropic.claude-3-5-sonnet-20241022-v2:0',
modelName: 'Claude 3.5 Sonnet',
modelId: 'anthropic.claude-3-5-sonnet-20240620-v1:0',
},
] as Model[];
}
Expand Down

0 comments on commit 50889e8

Please sign in to comment.