Skip to content

Improve type safety for view mode and custom component #110

@Michelprogram

Description

@Michelprogram

Related PR
Made a small change to improve type safety for view modes.
Instead of guessing the props type for view modes, you now need to explicitly specify the props type, otherwise you’ll get a type error.

For example:

// In a Request component
import { RequestReadableViewModeProps } from '@caido/sdk-frontend';

const { request, view, sdk } = 
  defineProps<RequestReadableViewModeProps>();

// In index.ts
sdk.automate.addRequestViewMode({
  label: "test",
  view: {
    component: Request,
  },
});

This applies to all view modes (Automate, Findings, etc.).

As mentioned in the documentation, some view modes are writable, such as Intercept and Replay. Those use their own props type: RequestWritableViewModeProps

There is also change for CommandPalette, the props type is now CommandPaletteViewProps

For example:

// In a CommandPalette component
import { CommandPaletteViewProps } from '@caido/sdk-frontend';

const { sdk, onClose, onBack } = defineProps<CommandPaletteViewProps>();

// In index.ts
sdk.commandPalette.pushView({
  type: "Custom",
  definition: {
    component: Command,
  },
});

And finally same for SlotContent, the props type is now SlotContentViewProps

For example:

// In a SlotContent component
import { SlotContentProps } from '@caido/sdk-frontend';

const { sdk } = defineProps<SlotContentProps>();


// In index.ts
sdk.footer.addToSlot("footer-primary", {
  type: "Custom",
  definition: {
    component: Footer,
  },
});

Metadata

Metadata

Assignees

Labels

documentationImprovements or additions to documentation

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions