-
Notifications
You must be signed in to change notification settings - Fork 690
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat: added notifications guide (#1379)
* feat: added notifications recipe * fix: some final tweaks * updates * updates * updates * updates * removed unnecessary tabs * renaming and such Signed-off-by: Lorenzo Lewis <[email protected]> * add to sidebar Signed-off-by: Lorenzo Lewis <[email protected]> * fix docsrs name Signed-off-by: Lorenzo Lewis <[email protected]> * add breadcrumb Signed-off-by: Lorenzo Lewis <[email protected]> * update lists Signed-off-by: Lorenzo Lewis <[email protected]> * fix broken link Signed-off-by: Lorenzo Lewis <[email protected]> * rearrange tab Signed-off-by: Lorenzo Lewis <[email protected]> * update todo Signed-off-by: Lorenzo Lewis <[email protected]> * update guide Signed-off-by: Lorenzo Lewis <[email protected]> * Update some phrasing Signed-off-by: Lorenzo Lewis <[email protected]> * update stub phrasing Signed-off-by: Lorenzo Lewis <[email protected]> * formatting Signed-off-by: Lorenzo Lewis <[email protected]> --------- Signed-off-by: Lorenzo Lewis <[email protected]> Co-authored-by: Lorenzo Lewis <[email protected]>
- Loading branch information
1 parent
9e201fe
commit e1e80e5
Showing
3 changed files
with
161 additions
and
11 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,10 +1,160 @@ | ||
--- | ||
title: Notification | ||
title: Notifications | ||
description: Send native notifications to the user. | ||
--- | ||
|
||
import PluginBreadcrumb from '@components/PluginBreadcrumb.astro'; | ||
import { Tabs, TabItem } from '@astrojs/starlight/components'; | ||
import CommandTabs from '@components/CommandTabs.astro'; | ||
import Stub from '@components/Stub.astro'; | ||
|
||
<Stub> | ||
Based on | ||
https://github.com/tauri-apps/plugins-workspace/tree/v2/plugins/notification | ||
</Stub> | ||
<PluginBreadcrumb | ||
version="v2.0.0-alpha.2" | ||
github="https://github.com/tauri-apps/plugins-workspace/tree/v2/plugins/notification" | ||
npm="https://www.npmjs.com/package/@tauri-apps/plugin-notification" | ||
cratesio="https://crates.io/crates/tauri-plugin-notification" | ||
jsApi="/2/reference/js/notification" | ||
docsrs="https://docs.rs/tauri-plugin-notification/2.0.0-alpha.2/tauri_plugin_notification/" | ||
/> | ||
|
||
Send native notifications to your user using the notification plugin. | ||
|
||
## Setup | ||
|
||
Install the notifications plugin to get started. | ||
|
||
<Tabs> | ||
<TabItem label="Automatic"> | ||
|
||
1. Use your project's package manager to add the dependency: | ||
|
||
<CommandTabs npm="npm run tauri plugin add notification" | ||
yarn="yarn run tauri plugin add notification" | ||
pnpm="pnpm tauri plugin add notification" | ||
cargo="cargo tauri plugin add notification" /> | ||
|
||
2. Modify `lib.rs` to initialize the plugin: | ||
|
||
{/* TODO: Revise once https://github.com/tauri-apps/tauri/issues/7696 is in */} | ||
|
||
```rust | ||
#[cfg_attr(mobile, tauri::mobile_entry_point)] | ||
pub fn run() { | ||
tauri::Builder::default() | ||
// Initialize the plugin | ||
.plugin(tauri_plugin_notification::init()) | ||
.run(tauri::generate_context!()) | ||
.expect("error while running tauri application"); | ||
} | ||
``` | ||
|
||
</TabItem> | ||
<TabItem label="Manual"> | ||
|
||
1. Run `cargo add tauri-plugin-notification` to add the plugin to the project's dependencies in `Cargo.toml`. | ||
|
||
2. Modify `lib.rs` to initialize the plugin: | ||
|
||
```rust | ||
// lib.rs | ||
#[cfg_attr(mobile, tauri::mobile_entry_point)] | ||
pub fn run() { | ||
tauri::Builder::default() | ||
// Initialize the plugin | ||
.plugin(tauri_plugin_notification::init()) | ||
.run(tauri::generate_context!()) | ||
.expect("error while running tauri application"); | ||
} | ||
``` | ||
|
||
3. If you'd like to use notifications in JavaScript then install the npm package as well: | ||
|
||
<CommandTabs | ||
npm="npm install @tauri-apps/plugin-notification" | ||
yarn="yarn add @tauri-apps/plugin-notification" | ||
pnpm="pnpm add @tauri-apps/plugin-notification" | ||
/> | ||
|
||
</TabItem> | ||
|
||
</Tabs> | ||
|
||
## Usage | ||
|
||
Here are a few examples of how to use the notification plugin: | ||
|
||
- [Sent notification to users](#send-notification) | ||
- [Add an action to a notification](#actions) | ||
- [Add an attachment to a notification](#attachments) | ||
- [Send a notification in a specific channel](#channels) | ||
|
||
{/* TODO: Link to which language to use, frontend vs. backend guide when it's made */} | ||
|
||
The notification plugin is available in both JavaScript and Rust. | ||
|
||
### Send Notification | ||
|
||
{/* TODO: Demo component */} | ||
|
||
Follow these steps to send a notification: | ||
|
||
1. Check if permission is granted | ||
2. Request permission if not granted | ||
3. Send the notification | ||
|
||
<Tabs> | ||
<TabItem label="JavaScript"> | ||
|
||
```js | ||
import { | ||
isPermissionGranted, | ||
requestPermission, | ||
sendNotification, | ||
} from '@tauri-apps/plugin-notification'; | ||
|
||
// Do you have permission to send a notification? | ||
let permissionGranted = await isPermissionGranted(); | ||
|
||
// If not we need to request it | ||
if (!permissionGranted) { | ||
const permission = await requestPermission(); | ||
permissionGranted = permission === 'granted'; | ||
} | ||
|
||
// Once permission has been granted we can send the notification | ||
if (permissionGranted) { | ||
sendNotification({ title: 'Tauri', body: 'Tauri is awesome!' }); | ||
} | ||
``` | ||
|
||
</TabItem> | ||
<TabItem label="Rust"> | ||
|
||
{/* TODO: */} | ||
|
||
<Stub /> | ||
|
||
</TabItem> | ||
</Tabs> | ||
|
||
### Actions | ||
|
||
{/* TODO: */} | ||
|
||
<Stub /> | ||
|
||
### Attachments | ||
|
||
{/* TODO: */} | ||
|
||
<Stub /> | ||
|
||
### Channels | ||
|
||
{/* TODO: */} | ||
|
||
<Stub /> | ||
|
||
## Security Considerations | ||
|
||
Aside from normal sanitization procedures of user input there are currently no known security considerations. |