filestack-react icon indicating copy to clipboard operation
filestack-react copied to clipboard

@types/filestack-react

Open vb2228 opened this issue 4 years ago • 11 comments

Hi, I was trying to use filestack-react in typescript, but it didn't suppose @typescript. Can anyone resolve this issue?

vb2228 avatar Oct 28 '19 02:10 vb2228

Any update on this one?

deltek-rossjackson avatar Feb 25 '20 20:02 deltek-rossjackson

I see typescript has been added to Filestack-react, but for some reason types aren't working for me in VS Code. I'm able to use Filestack-react components just fine, it's only the typing that isn't working right.

I don't know much about how VS Code finds d.ts files, but perhaps it's because the d.ts file isn't located in the dist folder (it's only in the src folder)?

image

mpoisot avatar Aug 14 '20 19:08 mpoisot

So it seems that the distribution in the filestack-react package does not export types, which means that a TS project will not be able to resolve the types correctly, despite the types being present in src/index.d.ts. Can the project maintainers please expose the types in the distribution so that TS projects can consume those types?

It would be great if you can publish types to Definitely Typed or bundle the types correctly so they are exposed in the project. Thank you!

BrentFarese avatar Oct 17 '20 03:10 BrentFarese

What we did in our codebase is that we recreated filestack-react and created our own button which is not hard to do. We use filestack-js which has the typings you need.

deltek-rossjackson avatar Oct 19 '20 14:10 deltek-rossjackson

What I ended up doing was create a file filestack-react.d at the top level of my project. I initially copied /src/index.d.ts, but I modified it a bit to eliminate warnings.

declare module "filestack-react" {
  import React from "react"
  import { PickerFileMetadata, ClientOptions } from "filestack-js"

  type FilestackAction =
    | "transform"
    | "retrieve"
    | "metadata"
    | "storeUrl"
    | "upload"
    | "multiupload"
    | "remove"
    | "pick"
    | "removeMetadata"
    | "preview"
    | "logout"

  type ComponentDisplayModeType = "button" | "link" | "immediate"

  interface Props {
    apikey: string | undefined
    action?: FilestackAction
    componentDisplayMode?: {
      type?: ComponentDisplayModeType
      customText?: string
      customClass?: string
    }
    onSuccess?: (data: PickerResponse) => void
    onError?: (error: PickerFileMetadata[]) => void
    clientOptions?: ClientOptions
    file?: File
    source?: string
    customRender?: React.ComponentType<{ onPick: (arg: unknown) => void }>
    actionOptions: OptionsObject
  }

  declare class ReactFilestack extends React.Component<Props> {}
  export default ReactFilestack
}

mpoisot avatar Oct 19 '20 16:10 mpoisot

These are valid workarounds but really the maintainer should publish types on DefinitelyTyped or generate and expose proper types in the dist directory. We are just consuming filestack-js as well but considered using the React component and ran across this common TS issue, which sort of prevented our use of the component.

BrentFarese avatar Oct 19 '20 20:10 BrentFarese

I figured out what was missing to get the existing types recognized and created a pull request.

mpoisot avatar Oct 19 '20 20:10 mpoisot

FYI v4.x also does not have any types.

namoscato avatar Feb 07 '21 14:02 namoscato

I realise everyone is busy but the fact that this package still does not have types is kind of a pain in the ass.

fishactual avatar Jul 08 '22 23:07 fishactual

This makes it incredibly difficult to use with React

zack-frontend avatar Jul 26 '22 22:07 zack-frontend