Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
67 changes: 24 additions & 43 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -87,52 +87,35 @@ You can choose one of the following two methods for configuration

We use **API Gateway** combined with **AWS Lambda** to enable streaming responses for up to 15 minutes. All requests are authenticated via API Gateway's API Key validation before being forwarded to Lambda, ensuring secure access to backend services.

### Step 1: Build and push container images to ECR
### Step 1: One-command deploy

1. Clone this repository:
```bash
git clone https://github.com/aws-samples/swift-chat.git
cd swift-chat
```
**Prerequisites:** AWS CLI configured with credentials (`aws configure`).

2. Run the build and push script:
```bash
cd server/scripts
bash ./push-to-ecr.sh
```
**Deploy with one command:**

3. Follow the prompts to configure:
- ECR repository name (or use default: `swift-chat-api`)
- Image tag (please use default: `latest`)
- AWS region (the region you want to deploy, e.g.,: `us-east-1`)

4. The script will build and push the Docker image to your ECR repository.

5. **Important**: Copy the image URI displayed at the end of the script output. You'll need this in the next step.

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

1. Download the CloudFormation template:
- Lambda: [SwiftChatLambda.template](https://github.com/aws-samples/swift-chat/blob/main/server/template/SwiftChatLambda.template)
```bash
curl -fsSL https://raw.githubusercontent.com/aws-samples/swift-chat/main/server/install.sh | bash
```

2. Go to [CloudFormation Console](https://console.aws.amazon.com/cloudformation/home#/stacks/create/template?stackName=SwiftChat) and select **Upload a template file** under **Specify template**, then upload the template file you downloaded.
By default this deploys to **the account of your current AWS profile**, in the region from `$AWS_REGION` or your `aws configure` default (fallback: `us-east-1`), with stack name `SwiftChat`. Wait about 3-4 minutes to see your **API URL**, **API Key** obtain link, and a scannable QR code for auto-configuring the app.

3. Click **Next**, On the "Specify stack details" page, provide the following information:
- **ContainerImageUri**: Enter the ECR image URI from Step 1 output
To target a different account, region, or stack:

4. Click **Next**, Keep the "Configure stack options" page as default, Read the Capabilities and Check the "I
acknowledge that AWS CloudFormation might create IAM resources" checkbox at the bottom.
5. Click **Next**, In the "Review and create" Review your configuration and click **Submit**.
```bash
./install.sh --region us-west-2 --stack MySwiftChat --profile myprofile
```

6. Wait about 1-2 minutes for the deployment to finish, then click the CloudFormation stack and go to **Outputs** tab:
- **APIURL**: Your API URL (e.g., `https://xxx.execute-api.us-east-1.amazonaws.com/v1`)
- **ApiKeyConsole**: Click this URL to open the API Gateway API Keys console, find the key named `SwiftChat-api-key` and copy the API Key value
| Flag | Purpose | Default |
|---|---|---|
| `--region` | AWS region to deploy into | `$AWS_REGION` or `us-east-1` |
| `--stack` | CloudFormation stack name | `SwiftChat` |
| `--profile` | AWS CLI profile to use | current default profile |

### Step 3: Open the App and setup with API URL and API Key
### Step 2: Open the App and setup with API URL and API Key

1. Launch the App, open the drawer menu, and tap **Settings**.
2. Paste the `API URL` and `API Key` under Amazon Bedrock -> SwiftChat Server, then select your Region.
3. Click the top right ✓ icon to save your configuration and start your chat.
2. Under Amazon Bedrock → SwiftChat Server, tap the scan icon next to **API URL** to scan the QR (iOS/Android) — or paste `API URL` and `API Key` manually.
3. Select your Region, then tap the top right ✓ to save.

Congratulations 🎉 Your SwiftChat App is ready to use!

Expand Down Expand Up @@ -453,14 +436,12 @@ the [release notes](https://github.com/aws-samples/swift-chat/releases) to see i

### Upgrade API

1. First, re-run the build script to update the image:
```bash
cd server/scripts
bash ./push-to-ecr.sh
```
Re-run the same install script; it will rebuild the image and refresh the Lambda automatically:

2. Click and open [Lambda Services](https://console.aws.amazon.com/lambda/home#/functions), find and open
your Lambda which starts with your stack name and `APIHandlerxxxxxxxx`, e.g. `SwiftChatAPI-APIHandler38F11976-ktGBZmQtp0D8`, click the **Deploy new image** button and click Save.
```bash
cd server
./install.sh --region <your-region> --stack <your-stack>
```


## Security
Expand Down
65 changes: 24 additions & 41 deletions README_CN.md
Original file line number Diff line number Diff line change
Expand Up @@ -83,51 +83,35 @@ SwiftChat 是一款快速响应的 AI 助手,采用 [React Native](https://rea

我们使用 **API Gateway** 与 **AWS Lambda** 结合的方式,实现最长 15 分钟的流式传输。所有请求通过 API Gateway 的 API Key 验证后才会转发到 Lambda,确保后端服务的安全访问。

### 步骤 1:构建并推送容器镜像到 ECR
### 步骤 1:一键部署

1. 克隆此仓库:
```bash
git clone https://github.com/aws-samples/swift-chat.git
cd swift-chat
```
**前置条件:** 已配置 AWS CLI 凭证(`aws configure`)。

2. 运行构建和推送脚本:
```bash
cd server/scripts
bash ./push-to-ecr.sh
```
**一行命令部署:**

3. 按照提示进行配置:
- ECR 仓库名称(或使用默认值:`swift-chat-api`)
- 镜像标签(请使用默认值:`latest`)
- AWS 区域(填写你希望部署的区域,例如:`us-east-1`)

4. 脚本将构建并推送 Docker 镜像到您的 ECR 仓库。

5. **重要**:复制脚本输出末尾显示的镜像 URI。您将在下一步中需要它。

### 步骤 2:部署堆栈并获取 API URL 和 API Key

1. 下载 CloudFormation 模板:
- Lambda:[SwiftChatLambda.template](https://github.com/aws-samples/swift-chat/blob/main/server/template/SwiftChatLambda.template)
```bash
curl -fsSL https://raw.githubusercontent.com/aws-samples/swift-chat/main/server/install.sh | bash
```

2. 前往 [CloudFormation 控制台](https://console.aws.amazon.com/cloudformation/home#/stacks/create/template?stackName=SwiftChat),在**指定模板**下选择**上传模板文件**,然后上传您下载的模板文件
默认部署到**当前 AWS profile 的账户**,region 取 `$AWS_REGION` 或 `aws configure` 的默认值(都未设置则为 `us-east-1`),堆栈名为 `SwiftChat`。等待约 3-4 分钟,您会看到 **API URL**、**API Key** 获取链接,以及可用手机扫描自动配置的二维码

3. 点击 **下一步**,在"指定堆栈详细信息"页面,提供以下信息:
- **ContainerImageUri**:输入步骤 1 输出的 ECR 镜像 URI
需要指定其他目标时:

4. 点击 **下一步**,保持"配置堆栈选项"页面为默认,阅读功能并勾选底部的"我确认 AWS CloudFormation 可能会创建 IAM 资源"复选框。
5. 点击 **下一步**,在"审核并创建"中检查您的配置并点击 **提交**。
```bash
./install.sh --region us-west-2 --stack MySwiftChat --profile myprofile
```

6. 等待约 1-2 分钟完成部署,然后点击 CloudFormation 堆栈并转到 **输出** 选项卡:
- **APIURL**:您的 API URL(例如:`https://xxx.execute-api.us-east-1.amazonaws.com/v1`)
- **ApiKeyConsole**:点击此 URL 打开 API Gateway API Keys 控制台,找到名为 `<StackName>-api-key` 的密钥并复制 API Key 值
| 参数 | 作用 | 默认值 |
|---|---|---|
| `--region` | 部署到的 AWS region | `$AWS_REGION` 或 `us-east-1` |
| `--stack` | CloudFormation 堆栈名 | `SwiftChat` |
| `--profile` | 使用的 AWS CLI profile | 当前默认 profile |

### 步骤 3:打开应用并使用 API URL 和 API Key 进行设置
### 步骤 2:打开应用并使用 API URL 和 API Key 进行设置

1. 启动应用,打开抽屉菜单,点击 **设置**。
2. 粘贴 `API URL` 和 `API Key` 到 Amazon Bedrock -> SwiftChat Server 下,然后选择您的区域
3. 点击右上角 ✓ 图标保存配置并开始聊天
2. 在 Amazon Bedrock → SwiftChat Server 下,点击 **API URL** 右侧的扫码图标扫描二维码(iOS/Android),或手动粘贴 `API URL` 和 `API Key`。
3. 选择 Region,然后点击右上角 ✓ 保存

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

Expand Down Expand Up @@ -435,13 +419,12 @@ npm run ios

### 升级 API

1. 首先重新运行构建脚本以更新镜像:
```bash
cd server/scripts
bash ./push-to-ecr.sh
```
重新执行同一条部署命令即可,脚本会自动重新构建镜像并刷新 Lambda:

2. 点击打开 [Lambda 服务](https://console.aws.amazon.com/lambda/home#/functions) 页面,找到并打开以stack名和`APIHandlerxxxxxxxx`开头的 Lambda 函数,例如`SwiftChatAPI-APIHandler38F11976-ktGBZmQtp0D8`,点击 **部署新镜像** 按钮并点击保存。
```bash
cd server
./install.sh --region <你的 region> --stack <你的 stack>
```

## 安全

Expand Down
78 changes: 78 additions & 0 deletions react-native/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,78 @@
# SwiftChat React Native

## Tech Stack

- **Framework**: React Native 0.83 (New Architecture)
- **Language**: TypeScript
- **Navigation**: React Navigation (Drawer + Stack)
- **Storage**: MMKV (encrypted)
- **Streaming**: SSE via `fetch` + `ReadableStream`
- **Markdown**: Custom renderer with Mermaid, code highlighting, HTML live preview
- **Voice**: Nova Sonic via native module
- **Platform**: iOS, Android, macOS (Catalyst)

## Project Structure

```
src/
├── api/ # API layer
│ ├── BedrockMessageConvertor.ts # Message format types & conversion
│ ├── ChatProviderRouter.ts # Routes to correct provider by ModelTag
│ ├── bedrock-api.ts # Bedrock Server SSE + image entry
│ ├── types.ts # ChatProvider interface
│ └── providers/ # Provider implementations (bedrock, openai, ollama, deepseek)
├── chat/ # Core chat
│ ├── ChatScreen.tsx # Main screen (~590 lines)
│ ├── hooks/ # Extracted logic (session, streaming, scroll, voice)
│ ├── service/ # BackgroundTask, VoiceChat
│ ├── util/ # FileUtils, messageUtils
│ └── component/
│ ├── input/ # InputArea, Send, AddFile, FileList, AudioWaveform
│ ├── message/ # ChatComponent, MessageList, MessageComponent
│ └── toolbar/ # Footer, ModelSelection, PromptList, WebSearch
├── core/ # Cross-module shared
│ ├── HapticUtils.ts
│ ├── ToastUtils.ts
│ └── markdown/ # Markdown/Mermaid/HTML rendering (15 files)
├── appgen/ # HTML app generation
│ ├── components/ # AIWebView, WebViewBridge
│ ├── screens/ # Gallery, Viewer, Create
│ ├── service/ # BackgroundStreamManager
│ └── util/ # ApplyDiff, DiffUtils
├── imagegen/ # Image generation
│ ├── ImageGalleryScreen.tsx
│ └── components/ # ImageSpinner, ImageProgressBar
├── websearch/ # Web search
│ ├── components/citation/ # CitationBadge, CitationList, CitationModal
│ ├── providers/ # Google, Bing, Baidu, Tavily
│ └── services/ # Orchestrator, IntentAnalysis, ContentFetch
├── storage/ # MMKV persistent storage (domain-split)
│ ├── StorageUtils.ts # Core instances + re-export hub
│ ├── ChatStorage.ts # Messages, sessions, history
│ ├── ModelStorage.ts # Models, API keys, tokens
│ ├── PromptStorage.ts # System prompts
│ ├── PreferenceStorage.ts # UI preferences
│ ├── SearchStorage.ts # Search config
│ ├── AppStorage.ts # Saved HTML apps
│ └── Constants.ts # Default models, prompts, regions
├── settings/ # Settings screens
├── history/ # Chat history sidebar & event context
├── prompt/ # Prompt management screen
├── theme/ # Theme context & colors
├── types/ # Shared type definitions (Chat.ts, RouteTypes.ts)
└── utils/ # ModelUtils, PlatformUtils, ErrorUtils
```

## Key Patterns

- **New provider**: Add `api/providers/xxx.ts` + register in `ChatProviderRouter.ts`
- **ChatScreen hooks**: Logic split into `useChatSession`, `useChatStreaming`, `useChatScroll`, `useChatVoice`
- **Storage**: Domain modules re-exported from `StorageUtils.ts` for backward compatibility
- **Markdown**: `core/markdown/` is provider-agnostic, reusable by any chat-like feature
Loading
Loading