@uppy/google-drive: refactor to TypeScript (#4979)

packages/@uppy/google-drive/.npmignore

@@ -0,0 +1 @@
+tsconfig.*

packages/@uppy/google-drive/src/DriveProviderViews.js

@@ -1,13 +0,0 @@
-import { ProviderViews } from '@uppy/provider-views'
-
-export default class DriveProviderViews extends ProviderViews {
-  toggleCheckbox (e, file) {
-    e.stopPropagation()
-    e.preventDefault()
-
-    // Shared Drives aren't selectable; for all else, defer to the base ProviderView.
-    if (!file.custom.isSharedDrive) {
-      super.toggleCheckbox(e, file)
-    }
-  }
-}

packages/@uppy/google-drive/src/DriveProviderViews.ts

@@ -0,0 +1,18 @@
+import { ProviderViews } from '@uppy/provider-views'
+import type { CompanionFile } from '@uppy/utils/lib/CompanionFile'
+import type { Body, Meta } from '@uppy/utils/lib/UppyFile'
+
+export default class DriveProviderViews<
+  M extends Meta,
+  B extends Body,
+> extends ProviderViews<M, B> {
+  toggleCheckbox = (e: Event, file: CompanionFile): void => {
+    e.stopPropagation()
+    e.preventDefault()
+
+    // Shared Drives aren't selectable; for all else, defer to the base ProviderView.
+    if (!file.custom!.isSharedDrive) {
+      super.toggleCheckbox(e, file)
+    }
+  }
+}

packages/@uppy/google-drive/src/GoogleDrive.jsx

@@ -1,84 +0,0 @@
-import { UIPlugin } from '@uppy/core'
-import { Provider, tokenStorage, getAllowedHosts } from '@uppy/companion-client'
-import { h } from 'preact'
-
-import packageJson from '../package.json'
-import DriveProviderViews from './DriveProviderViews.js'
-import locale from './locale.js'
-
-export default class GoogleDrive extends UIPlugin {
-  static VERSION = packageJson.version
-
-  constructor (uppy, opts) {
-    super(uppy, opts)
-    this.type = 'acquirer'
-    this.storage = this.opts.storage || tokenStorage
-    this.files = []
-    this.id = this.opts.id || 'GoogleDrive'
-    this.icon = () => (
-      <svg
-        aria-hidden="true"
-        focusable="false"
-        width="32"
-        height="32"
-        viewBox="0 0 32 32"
-      >
-        <g fillRule="nonzero" fill="none">
-          <path d="M6.663 22.284l.97 1.62c.202.34.492.609.832.804l3.465-5.798H5c0 .378.1.755.302 1.096l1.361 2.278z" fill="#0066DA" />
-          <path d="M16 12.09l-3.465-5.798c-.34.195-.63.463-.832.804l-6.4 10.718A2.15 2.15 0 005 18.91h6.93L16 12.09z" fill="#00AC47" />
-          <path d="M23.535 24.708c.34-.195.63-.463.832-.804l.403-.67 1.928-3.228c.201-.34.302-.718.302-1.096h-6.93l1.474 2.802 1.991 2.996z" fill="#EA4335" />
-          <path d="M16 12.09l3.465-5.798A2.274 2.274 0 0018.331 6h-4.662c-.403 0-.794.11-1.134.292L16 12.09z" fill="#00832D" />
-          <path d="M20.07 18.91h-8.14l-3.465 5.798c.34.195.73.292 1.134.292h12.802c.403 0 .794-.11 1.134-.292L20.07 18.91z" fill="#2684FC" />
-          <path d="M23.497 12.455l-3.2-5.359a2.252 2.252 0 00-.832-.804L16 12.09l4.07 6.82h6.917c0-.377-.1-.755-.302-1.096l-3.188-5.359z" fill="#FFBA00" />
-        </g>
-      </svg>
-    )
-
-    this.opts.companionAllowedHosts = getAllowedHosts(this.opts.companionAllowedHosts, this.opts.companionUrl)
-    this.provider = new Provider(uppy, {
-      companionUrl: this.opts.companionUrl,
-      companionHeaders: this.opts.companionHeaders,
-      companionKeysParams: this.opts.companionKeysParams,
-      companionCookiesRule: this.opts.companionCookiesRule,
-      provider: 'drive',
-      pluginId: this.id,
-      supportsRefreshToken: true,
-    })
-
-    this.defaultLocale = locale
-
-    this.i18nInit()
-    this.title = this.i18n('pluginNameGoogleDrive')
-
-    this.onFirstRender = this.onFirstRender.bind(this)
-    this.render = this.render.bind(this)
-  }
-
-  install () {
-    this.view = new DriveProviderViews(this, {
-      provider: this.provider,
-      loadAllFiles: true,
-    })
-
-    const { target } = this.opts
-    if (target) {
-      this.mount(target, this)
-    }
-  }
-
-  uninstall () {
-    this.view.tearDown()
-    this.unmount()
-  }
-
-  onFirstRender () {
-    return Promise.all([
-      this.provider.fetchPreAuthToken(),
-      this.view.getFolder('root'),
-    ])
-  }
-
-  render (state) {
-    return this.view.render(state)
-  }
-}

packages/@uppy/google-drive/src/GoogleDrive.tsx

@@ -0,0 +1,130 @@
+import {
+  Provider,
+  getAllowedHosts,
+  tokenStorage,
+  type CompanionPluginOptions,
+} from '@uppy/companion-client'
+import { UIPlugin, Uppy } from '@uppy/core'
+import { ProviderViews } from '@uppy/provider-views'
+import { h, type ComponentChild } from 'preact'
+
+import type { UppyFile, Body, Meta } from '@uppy/utils/lib/UppyFile'
+import type { UnknownProviderPluginState } from '@uppy/core/lib/Uppy.ts'
+import DriveProviderViews from './DriveProviderViews.ts'
+import locale from './locale.ts'
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+// @ts-ignore We don't want TS to generate types for the package.json
+import packageJson from '../package.json'
+
+export type GoogleDriveOptions = CompanionPluginOptions
+
+export default class GoogleDrive<
+  M extends Meta,
+  B extends Body,
+> extends UIPlugin<GoogleDriveOptions, M, B, UnknownProviderPluginState> {
+  static VERSION = packageJson.version
+
+  icon: () => JSX.Element
+
+  provider: Provider<M, B>
+
+  view: ProviderViews<M, B>
+
+  storage: typeof tokenStorage
+
+  files: UppyFile<M, B>[]
+
+  constructor(uppy: Uppy<M, B>, opts: GoogleDriveOptions) {
+    super(uppy, opts)
+    this.type = 'acquirer'
+    this.storage = this.opts.storage || tokenStorage
+    this.files = []
+    this.id = this.opts.id || 'GoogleDrive'
+    this.icon = () => (
+      <svg
+        aria-hidden="true"
+        focusable="false"
+        width="32"
+        height="32"
+        viewBox="0 0 32 32"
+      >
+        <g fillRule="nonzero" fill="none">
+          <path
+            d="M6.663 22.284l.97 1.62c.202.34.492.609.832.804l3.465-5.798H5c0 .378.1.755.302 1.096l1.361 2.278z"
+            fill="#0066DA"
+          />
+          <path
+            d="M16 12.09l-3.465-5.798c-.34.195-.63.463-.832.804l-6.4 10.718A2.15 2.15 0 005 18.91h6.93L16 12.09z"
+            fill="#00AC47"
+          />
+          <path
+            d="M23.535 24.708c.34-.195.63-.463.832-.804l.403-.67 1.928-3.228c.201-.34.302-.718.302-1.096h-6.93l1.474 2.802 1.991 2.996z"
+            fill="#EA4335"
+          />
+          <path
+            d="M16 12.09l3.465-5.798A2.274 2.274 0 0018.331 6h-4.662c-.403 0-.794.11-1.134.292L16 12.09z"
+            fill="#00832D"
+          />
+          <path
+            d="M20.07 18.91h-8.14l-3.465 5.798c.34.195.73.292 1.134.292h12.802c.403 0 .794-.11 1.134-.292L20.07 18.91z"
+            fill="#2684FC"
+          />
+          <path
+            d="M23.497 12.455l-3.2-5.359a2.252 2.252 0 00-.832-.804L16 12.09l4.07 6.82h6.917c0-.377-.1-.755-.302-1.096l-3.188-5.359z"
+            fill="#FFBA00"
+          />
+        </g>
+      </svg>
+    )
+
+    this.opts.companionAllowedHosts = getAllowedHosts(
+      this.opts.companionAllowedHosts,
+      this.opts.companionUrl,
+    )
+    this.provider = new Provider(uppy, {
+      companionUrl: this.opts.companionUrl,
+      companionHeaders: this.opts.companionHeaders,
+      companionKeysParams: this.opts.companionKeysParams,
+      companionCookiesRule: this.opts.companionCookiesRule,
+      provider: 'drive',
+      pluginId: this.id,
+      supportsRefreshToken: true,
+    })
+
+    this.defaultLocale = locale
+
+    this.i18nInit()
+    this.title = this.i18n('pluginNameGoogleDrive')
+
+    this.onFirstRender = this.onFirstRender.bind(this)
+    this.render = this.render.bind(this)
+  }
+
+  install(): void {
+    this.view = new DriveProviderViews(this, {
+      provider: this.provider,
+      loadAllFiles: true,
+    })
+
+    const { target } = this.opts
+    if (target) {
+      this.mount(target, this)
+    }
+  }
+
+  uninstall(): void {
+    this.view.tearDown()
+    this.unmount()
+  }
+
+  async onFirstRender(): Promise<void> {
+    await Promise.all([
+      this.provider.fetchPreAuthToken(),
+      this.view.getFolder('root'),
+    ])
+  }
+
+  render(state: unknown): ComponentChild {
+    return this.view.render(state)
+  }
+}

packages/@uppy/google-drive/src/index.js

@@ -1 +0,0 @@
-export { default } from './GoogleDrive.jsx'

packages/@uppy/google-drive/src/index.ts

@@ -0,0 +1 @@
+export { default } from './GoogleDrive.tsx'

packages/@uppy/google-drive/tsconfig.build.json

@@ -0,0 +1,35 @@
+{
+  "extends": "../../../tsconfig.shared",
+  "compilerOptions": {
+    "noImplicitAny": false,
+    "outDir": "./lib",
+    "paths": {
+      "@uppy/companion-client": ["../companion-client/src/index.js"],
+      "@uppy/companion-client/lib/*": ["../companion-client/src/*"],
+      "@uppy/provider-views": ["../provider-views/src/index.js"],
+      "@uppy/provider-views/lib/*": ["../provider-views/src/*"],
+      "@uppy/utils/lib/*": ["../utils/src/*"],
+      "@uppy/core": ["../core/src/index.js"],
+      "@uppy/core/lib/*": ["../core/src/*"]
+    },
+    "resolveJsonModule": false,
+    "rootDir": "./src",
+    "skipLibCheck": true
+  },
+  "include": ["./src/**/*.*"],
+  "exclude": ["./src/**/*.test.ts"],
+  "references": [
+    {
+      "path": "../companion-client/tsconfig.build.json"
+    },
+    {
+      "path": "../provider-views/tsconfig.build.json"
+    },
+    {
+      "path": "../utils/tsconfig.build.json"
+    },
+    {
+      "path": "../core/tsconfig.build.json"
+    }
+  ]
+}

packages/@uppy/google-drive/tsconfig.json

@@ -0,0 +1,31 @@
+{
+  "extends": "../../../tsconfig.shared",
+  "compilerOptions": {
+    "emitDeclarationOnly": false,
+    "noEmit": true,
+    "paths": {
+      "@uppy/companion-client": ["../companion-client/src/index.js"],
+      "@uppy/companion-client/lib/*": ["../companion-client/src/*"],
+      "@uppy/provider-views": ["../provider-views/src/index.js"],
+      "@uppy/provider-views/lib/*": ["../provider-views/src/*"],
+      "@uppy/utils/lib/*": ["../utils/src/*"],
+      "@uppy/core": ["../core/src/index.js"],
+      "@uppy/core/lib/*": ["../core/src/*"],
+    },
+  },
+  "include": ["./package.json", "./src/**/*.*"],
+  "references": [
+    {
+      "path": "../companion-client/tsconfig.build.json",
+    },
+    {
+      "path": "../provider-views/tsconfig.build.json",
+    },
+    {
+      "path": "../utils/tsconfig.build.json",
+    },
+    {
+      "path": "../core/tsconfig.build.json",
+    },
+  ],
+}

packages/@uppy/utils/src/CompanionFile.ts

@@ -22,4 +22,14 @@ export type CompanionFile = {
     name?: string
     url?: string
   }
+  custom?: {
+    isSharedDrive: boolean
+    imageHeight: number
+    imageWidth: number
+    imageRotation: number
+    imageDateTime: string
+    videoHeight: number
+    videoWidth: number
+    videoDurationMillis: number
+  }
 }