refactor!: simplify TrayIconEvent in JS by tagging it with type field
#11121
Conversation
Package Changes Through ee90884There are 10 changes which include tauri with prerelease, @tauri-apps/api with prerelease, tauri-bundler with prerelease, tauri-cli with prerelease, tauri-runtime-wry with prerelease, tauri-runtime with prerelease, tauri-utils with prerelease, @tauri-apps/cli with prerelease, tauri-build with prerelease, tauri-codegen with prerelease Planned Package VersionsThe following package releases are the planned based on the context of changes in this pull request.
Add another change file through the GitHub UI by following this link. Read about change files or the docs at github.com/jbolda/covector |
diff --git a/packages/api/src/tray.ts b/packages/api/src/tray.ts
index 45820fe4d..b662fe8ab 100644
--- a/packages/api/src/tray.ts
+++ b/packages/api/src/tray.ts
@@ -16,15 +16,7 @@ export type TrayIconEventType =
| 'Move'
| 'Leave'
-/**
- * Describes a tray icon event.
- *
- * #### Platform-specific:
- *
- * - **Linux**: Unsupported. The event is not emitted even though the icon is shown,
- * the icon will still show a context menu on right click.
- */
-export type TrayIconEvent<T extends TrayIconEventType = TrayIconEventType> = {
+export type BaseTrayIconEvent<T extends TrayIconEventType> = {
/** The tray icon event type */
type: T
/** Id of the tray icon which triggered this event. */
@@ -36,18 +28,52 @@ export type TrayIconEvent<T extends TrayIconEventType = TrayIconEventType> = {
position: PhysicalPosition
size: PhysicalSize
}
-} & (T extends 'Click' | 'DoubleClick'
- ? {
- /** Mouse button that triggered this event. */
- button: MouseButton
- }
- : never) &
- (T extends 'Click'
- ? {
+}
+
+export type TrayIconClickEvent = {
+ /** Mouse button that triggered this event. */
+ button: MouseButton
+}
+
+/**
+ * Describes a tray icon event.
+ *
+ * #### Platform-specific:
+ *
+ * - **Linux**: Unsupported. The event is not emitted even though the icon is shown,
+ * the icon will still show a context menu on right click.
+ */
+export type TrayIconEvent =
+ | (BaseTrayIconEvent<'Click'> &
+ TrayIconClickEvent & {
/** Mouse button state when this event was triggered. */
buttonState: MouseButtonState
+ })
+ | (BaseTrayIconEvent<'DoubleClick'> & TrayIconClickEvent)
+ | BaseTrayIconEvent<'Enter'>
+ | BaseTrayIconEvent<'Move'>
+ | BaseTrayIconEvent<'Leave'>
+
+type TrayIconEventInternal = Omit<TrayIconEvent, 'rect' | 'position'> & {
+ position: {
+ x: number
+ y: number
+ }
+ rect: {
+ position: {
+ Physical: {
+ x: number
+ y: number
}
- : never)
+ }
+ size: {
+ Physical: {
+ width: number
+ height: number
+ }
+ }
+ }
+}
/**
* Tray icon types and utilities.
@@ -166,37 +192,24 @@ export class TrayIcon extends Resource {
options.icon = transformImage(options.icon)
}
- const handler = new Channel<TrayIconEvent>()
+ const handler = new Channel<TrayIconEventInternal>()
if (options?.action) {
const action = options.action
handler.onmessage = (e) => {
- if (
- 'Physical' in e.rect.position &&
- e.rect.position.Physical &&
- typeof e.rect.position.Physical === 'object' &&
- 'x' in e.rect.position.Physical &&
- 'y' in e.rect.position.Physical
- ) {
- e.rect.position = new PhysicalPosition(
- e.rect.position.Physical.x as number,
- e.rect.position.Physical.y as number
- )
- }
- if (
- 'Physical' in e.rect.size &&
- e.rect.size.Physical &&
- typeof e.rect.size.Physical === 'object' &&
- 'width' in e.rect.size.Physical &&
- 'height' in e.rect.size.Physical
- ) {
- e.rect.size = new PhysicalSize(
- e.rect.size.Physical.width as number,
- e.rect.size.Physical.height as number
+ // e.position = new PhysicalPosition(e.position.x, e.position.y)
+ const out = e as unknown as TrayIconEvent
+ out.position = new PhysicalPosition(e.position.x, e.position.y)
+ out.rect = {
+ position: new PhysicalPosition(
+ e.rect.position.Physical.x,
+ e.rect.position.Physical.y
+ ),
+ size: new PhysicalSize(
+ e.rect.size.Physical.width,
+ e.rect.size.Physical.height
)
}
- e.position = new PhysicalPosition(e.position.x, e.position.y)
-
- action(e)
+ action(out)
}
delete options.action
}@amrbashir I think something like this would be better |
|
If you like the idea of typing the internal event as well, here's the updated diff diff --git a/packages/api/src/tray.ts b/packages/api/src/tray.ts
index 040117a09..118928dd2 100644
--- a/packages/api/src/tray.ts
+++ b/packages/api/src/tray.ts
@@ -52,6 +52,27 @@ export type TrayIconEvent =
| TrayIconEventBase<'Move'>
| TrayIconEventBase<'Leave'>
+type TrayIconEventInternal = Omit<TrayIconEvent, 'rect' | 'position'> & {
+ position: {
+ x: number
+ y: number
+ }
+ rect: {
+ position: {
+ Physical: {
+ x: number
+ y: number
+ }
+ }
+ size: {
+ Physical: {
+ width: number
+ height: number
+ }
+ }
+ }
+}
+
/**
* Tray icon types and utilities.
*
@@ -169,37 +190,23 @@ export class TrayIcon extends Resource {
options.icon = transformImage(options.icon)
}
- const handler = new Channel<TrayIconEvent>()
+ const handler = new Channel<TrayIconEventInternal>()
if (options?.action) {
const action = options.action
handler.onmessage = (e) => {
- if (
- 'Physical' in e.rect.position &&
- e.rect.position.Physical &&
- typeof e.rect.position.Physical === 'object' &&
- 'x' in e.rect.position.Physical &&
- 'y' in e.rect.position.Physical
- ) {
- e.rect.position = new PhysicalPosition(
- e.rect.position.Physical.x as number,
- e.rect.position.Physical.y as number
+ const out = e as unknown as TrayIconEvent
+ out.position = new PhysicalPosition(e.position.x, e.position.y)
+ out.rect = {
+ position: new PhysicalPosition(
+ e.rect.position.Physical.x,
+ e.rect.position.Physical.y
+ ),
+ size: new PhysicalSize(
+ e.rect.size.Physical.width,
+ e.rect.size.Physical.height
)
}
- if (
- 'Physical' in e.rect.size &&
- e.rect.size.Physical &&
- typeof e.rect.size.Physical === 'object' &&
- 'width' in e.rect.size.Physical &&
- 'height' in e.rect.size.Physical
- ) {
- e.rect.size = new PhysicalSize(
- e.rect.size.Physical.width as number,
- e.rect.size.Physical.height as number
- )
- }
- e.position = new PhysicalPosition(e.position.x, e.position.y)
-
- action(e)
+ action(out)
}
delete options.action
} |
|
narrowing using JS checks is better here IMO since it ensures we never construct invalid |
|
Currently it's guaranteed to be |
|
I honestly feel like it's probably easier to use a custom |
I will add checks for As for the confusing part, I don't think there is a way around that, we still need to check whether
We need to create an instance of |
|
I have added checks for |
We will still need to create the instance but we won't need to check I don't quite like this union type to be honest, this forces the user to check whether this is a physical one or a logical one, and doesn't really match the fact that we return This is also hard to convert in the js side, getting the dpi requires an async ipc call, and we don't even have a getter for getting the dpi at position yet, we only have one for the windows |
|
good point, changed that and enforced the deserialization always matches on the Rust side |
Co-authored-by: Tony <[email protected]>
Co-authored-by: Tony <[email protected]>
ref: https://discord.com/channels/616186924390023171/986184094050316358/1287961960146669659 and tauri-apps/plugins-workspace#1822 (comment)