Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Typed data instead of any-type in DropEvent #129

Open
Tlepel opened this issue Dec 1, 2022 · 2 comments
Open

Typed data instead of any-type in DropEvent #129

Tlepel opened this issue Dec 1, 2022 · 2 comments
Assignees

Comments

@Tlepel
Copy link

Tlepel commented Dec 1, 2022

Is your feature request related to a problem? Please describe.
We're currently in the process of strictly typing our templates, and we have to make an ugly workaround for the DndDropEvent since it's data property is typed any instead of a generic T.

Describe the solution you'd like
Being able to assume a type in handler-functions, such as onDrop(event: DndDropEvent<MyDataType>), in which event gets the property data: MyDataType instead of data: any.

Describe alternatives you've considered
An alternative would be to use the type property (which is typed with any as well) and a switch-case to check whether or not we can use as to convert the data to the correct type. Another alternative I've considered is to create interfaces that have the exact properties we have on the relevant types, and perform instanceof checks.

We can't use Angular Material Drag & Drop for dragging, since the lists are nested and it doesn't support nested lists. However, Angular Material does have the option to type the data property of the event.

@ChristofFritz
Copy link
Collaborator

I'll look into it this week. This would certainly be beneficial to our app as well.

@Francisco-RP
Copy link

I think this would be a simple change that wouldn't break backwards functionality if you did something like this:

export interface DndDropEvent<T = any, U = any> {
  event: DragEvent;
  dropEffect: DropEffect;
  isExternal: boolean;
  data?: T;
  index?: number;
  type?: U;
}

Right now this is what I'm doing to get stricter typing

import { DndDropEvent } from 'ngx-drag-drop'

interface MyDropEvent<T = any, U = any> extends DndDropEvent {
  data: T; // made this required for our app
  type?: U;
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

3 participants