PartialTree - get rid of .onFirstRender() (#5187)

everywhere - get rid of `.onFirstRender()`

examples/custom-provider/client/MyCustomProvider.jsx

@@ -15,6 +15,7 @@ export default class MyCustomProvider extends UIPlugin {
     this.type = 'acquirer'
     this.storage = this.opts.storage || tokenStorage
     this.files = []
+    this.rootFolderId = null
 
     this.icon = () => (
       <svg width="32" height="32" xmlns="http://www.w3.org/2000/svg">
@@ -70,10 +71,6 @@ export default class MyCustomProvider extends UIPlugin {
     this.unmount()
   }
 
-  onFirstRender() {
-    return this.view.getFolder()
-  }
-
   render(state) {
     return this.view.render(state)
   }

packages/@uppy/box/src/Box.tsx

@@ -35,6 +35,8 @@ export default class Box<M extends Meta, B extends Body> extends UIPlugin<
 
   files: UppyFile<M, B>[]
 
+  rootFolderId: string | null = null
+
   constructor(uppy: Uppy<M, B>, opts: BoxOptions) {
     super(uppy, opts)
     this.id = this.opts.id || 'Box'
@@ -76,7 +78,6 @@ export default class Box<M extends Meta, B extends Body> extends UIPlugin<
     this.i18nInit()
     this.title = this.i18n('pluginNameBox')
 
-    this.onFirstRender = this.onFirstRender.bind(this)
     this.render = this.render.bind(this)
   }
 
@@ -97,13 +98,6 @@ export default class Box<M extends Meta, B extends Body> extends UIPlugin<
     this.unmount()
   }
 
-  async onFirstRender(): Promise<void> {
-    await Promise.all([
-      this.provider.fetchPreAuthToken(),
-      this.view.getFolder(),
-    ])
-  }
-
   render(state: unknown): ComponentChild {
     return this.view.render(state)
   }

packages/@uppy/core/src/Uppy.ts

@@ -92,7 +92,7 @@ export type UnknownProviderPlugin<
   M extends Meta,
   B extends Body,
 > = UnknownPlugin<M, B, UnknownProviderPluginState> & {
-  onFirstRender: () => void
+  rootFolderId: string | null
   title: string
   files: UppyFile<M, B>[]
   icon: () => h.JSX.Element
@@ -129,7 +129,6 @@ export type UnknownSearchProviderPlugin<
   M extends Meta,
   B extends Body,
 > = UnknownPlugin<M, B, UnknownSearchProviderPluginState> & {
-  onFirstRender: () => void
   title: string
   icon: () => h.JSX.Element
   provider: CompanionClientSearchProvider

packages/@uppy/dropbox/src/Dropbox.tsx

@@ -35,6 +35,8 @@ export default class Dropbox<M extends Meta, B extends Body> extends UIPlugin<
 
   files: UppyFile<M, B>[]
 
+  rootFolderId: string | null = null
+
   constructor(uppy: Uppy<M, B>, opts: DropboxOptions) {
     super(uppy, opts)
     this.id = this.opts.id || 'Dropbox'
@@ -77,7 +79,6 @@ export default class Dropbox<M extends Meta, B extends Body> extends UIPlugin<
     this.i18nInit()
     this.title = this.i18n('pluginNameDropbox')
 
-    this.onFirstRender = this.onFirstRender.bind(this)
     this.render = this.render.bind(this)
   }
 
@@ -98,13 +99,6 @@ export default class Dropbox<M extends Meta, B extends Body> extends UIPlugin<
     this.unmount()
   }
 
-  async onFirstRender(): Promise<void> {
-    await Promise.all([
-      this.provider.fetchPreAuthToken(),
-      this.view.getFolder(),
-    ])
-  }
-
   render(state: unknown): ComponentChild {
     return this.view.render(state)
   }

packages/@uppy/facebook/src/Facebook.tsx

@@ -35,6 +35,8 @@ export default class Facebook<M extends Meta, B extends Body> extends UIPlugin<
 
   files: UppyFile<M, B>[]
 
+  rootFolderId: string | null = null
+
   constructor(uppy: Uppy<M, B>, opts: FacebookOptions) {
     super(uppy, opts)
     this.id = this.opts.id || 'Facebook'
@@ -81,7 +83,6 @@ export default class Facebook<M extends Meta, B extends Body> extends UIPlugin<
     this.i18nInit()
     this.title = this.i18n('pluginNameFacebook')
 
-    this.onFirstRender = this.onFirstRender.bind(this)
     this.render = this.render.bind(this)
   }
 
@@ -101,13 +102,6 @@ export default class Facebook<M extends Meta, B extends Body> extends UIPlugin<
     this.unmount()
   }
 
-  async onFirstRender(): Promise<void> {
-    await Promise.all([
-      this.provider.fetchPreAuthToken(),
-      this.view.getFolder(),
-    ])
-  }
-
   render(state: unknown): ComponentChild {
     const viewOptions: {
       viewType?: string

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

@@ -34,6 +34,8 @@ export default class GoogleDrive<
 
   files: UppyFile<M, B>[]
 
+  rootFolderId: string | null = 'root'
+
   constructor(uppy: Uppy<M, B>, opts: GoogleDriveOptions) {
     super(uppy, opts)
     this.type = 'acquirer'
@@ -96,7 +98,6 @@ export default class GoogleDrive<
     this.i18nInit()
     this.title = this.i18n('pluginNameGoogleDrive')
 
-    this.onFirstRender = this.onFirstRender.bind(this)
     this.render = this.render.bind(this)
   }
 
@@ -117,13 +118,6 @@ export default class GoogleDrive<
     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/instagram/src/Instagram.tsx

@@ -35,6 +35,8 @@ export default class Instagram<M extends Meta, B extends Body> extends UIPlugin<
 
   files: UppyFile<M, B>[]
 
+  rootFolderId: string | null = 'recent'
+
   constructor(uppy: Uppy<M, B>, opts: InstagramOptions) {
     super(uppy, opts)
     this.type = 'acquirer'
@@ -90,7 +92,6 @@ export default class Instagram<M extends Meta, B extends Body> extends UIPlugin<
       supportsRefreshToken: false,
     })
 
-    this.onFirstRender = this.onFirstRender.bind(this)
     this.render = this.render.bind(this)
   }
 
@@ -114,13 +115,6 @@ export default class Instagram<M extends Meta, B extends Body> extends UIPlugin<
     this.unmount()
   }
 
-  async onFirstRender(): Promise<void> {
-    await Promise.all([
-      this.provider.fetchPreAuthToken(),
-      this.view.getFolder('recent'),
-    ])
-  }
-
   render(state: unknown): ComponentChild {
     return this.view.render(state)
   }

packages/@uppy/onedrive/src/OneDrive.tsx

@@ -35,6 +35,8 @@ export default class OneDrive<M extends Meta, B extends Body> extends UIPlugin<
 
   files: UppyFile<M, B>[]
 
+  rootFolderId: string | null = null
+
   constructor(uppy: Uppy<M, B>, opts: OneDriveOptions) {
     super(uppy, opts)
     this.type = 'acquirer'
@@ -89,7 +91,6 @@ export default class OneDrive<M extends Meta, B extends Body> extends UIPlugin<
     this.i18nInit()
     this.title = this.i18n('pluginNameOneDrive')
 
-    this.onFirstRender = this.onFirstRender.bind(this)
     this.render = this.render.bind(this)
   }
 
@@ -110,13 +111,6 @@ export default class OneDrive<M extends Meta, B extends Body> extends UIPlugin<
     this.unmount()
   }
 
-  async onFirstRender(): Promise<void> {
-    await Promise.all([
-      this.provider.fetchPreAuthToken(),
-      this.view.getFolder(),
-    ])
-  }
-
   render(state: unknown): ComponentChild {
     return this.view.render(state)
   }

packages/@uppy/provider-views/README.md

@@ -24,13 +24,6 @@ class GoogleDrive extends UIPlugin {
     // snip
   }
 
-  onFirstRender() {
-    return Promise.all([
-      this.provider.fetchPreAuthToken(),
-      this.view.getFolder('root'),
-    ])
-  }
-
   render(state) {
     return this.view.render(state)
   }

packages/@uppy/provider-views/src/ProviderView/ProviderView.tsx

@@ -343,7 +343,7 @@ export default class ProviderView<M extends Meta, B extends Body> extends View<
         this.setLoading(true)
         await this.provider.login({ authFormData, signal })
         this.plugin.setPluginState({ authenticated: true })
-        this.preFirstRender()
+        await this.getFolder(this.plugin.rootFolderId || undefined)
       })
     } catch (err) {
       if (err.name === 'UserFacingApiError') {
@@ -552,7 +552,9 @@ export default class ProviderView<M extends Meta, B extends Body> extends View<
     const { i18n } = this.plugin.uppy
 
     if (!didFirstRender) {
-      this.preFirstRender()
+      this.plugin.setPluginState({ didFirstRender: true })
+      this.provider.fetchPreAuthToken()
+      this.getFolder(this.plugin.rootFolderId || undefined)
     }
 
     const targetViewOptions = { ...this.opts, ...viewOptions }

packages/@uppy/provider-views/src/SearchProviderView/SearchProviderView.tsx

@@ -156,14 +156,9 @@ export default class SearchProviderView<
     state: unknown,
     viewOptions: Omit<ViewOptions<M, B, PluginType>, 'provider'> = {},
   ) {
-    const { didFirstRender, isInputMode, searchTerm } =
-      this.plugin.getPluginState()
+    const { isInputMode, searchTerm } = this.plugin.getPluginState()
     const { i18n } = this.plugin.uppy
 
-    if (!didFirstRender) {
-      this.preFirstRender()
-    }
-
     const targetViewOptions = { ...this.opts, ...viewOptions }
     const { files, folders, filterInput, loading, currentSelection } =
       this.plugin.getPluginState()

packages/@uppy/provider-views/src/View.ts

@@ -63,17 +63,11 @@ export default class View<
 
     this.isHandlingScroll = false
 
-    this.preFirstRender = this.preFirstRender.bind(this)
     this.handleError = this.handleError.bind(this)
     this.clearSelection = this.clearSelection.bind(this)
     this.cancelPicking = this.cancelPicking.bind(this)
   }
 
-  preFirstRender(): void {
-    this.plugin.setPluginState({ didFirstRender: true })
-    this.plugin.onFirstRender()
-  }
-
   shouldHandleScroll(event: Event): boolean {
     const { scrollHeight, scrollTop, offsetHeight } =
       event.target as HTMLElement

packages/@uppy/unsplash/src/Unsplash.tsx

@@ -97,11 +97,6 @@ export default class Unsplash<M extends Meta, B extends Body> extends UIPlugin<
     }
   }
 
-  // eslint-disable-next-line class-methods-use-this
-  async onFirstRender(): Promise<void> {
-    // do nothing
-  }
-
   render(state: unknown): ComponentChild {
     return this.view.render(state)
   }

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

@@ -23,6 +23,7 @@ export interface CompanionClientProvider {
   provider: string
   login(options?: RequestOptions): Promise<void>
   logout<ResBody>(options?: RequestOptions): Promise<ResBody>
+  fetchPreAuthToken(): Promise<void>
   list<ResBody>(
     directory: string | undefined,
     options: RequestOptions,

packages/@uppy/zoom/src/Zoom.tsx

@@ -35,6 +35,8 @@ export default class Zoom<M extends Meta, B extends Body> extends UIPlugin<
 
   files: UppyFile<M, B>[]
 
+  rootFolderId: string | null = null
+
   constructor(uppy: Uppy<M, B>, opts: ZoomOptions) {
     super(uppy, opts)
     this.type = 'acquirer'
@@ -76,7 +78,6 @@ export default class Zoom<M extends Meta, B extends Body> extends UIPlugin<
     this.i18nInit()
     this.title = this.i18n('pluginNameZoom')
 
-    this.onFirstRender = this.onFirstRender.bind(this)
     this.render = this.render.bind(this)
   }
 
@@ -96,13 +97,6 @@ export default class Zoom<M extends Meta, B extends Body> extends UIPlugin<
     this.unmount()
   }
 
-  async onFirstRender(): Promise<void> {
-    await Promise.all([
-      this.provider.fetchPreAuthToken(),
-      this.view.getFolder(),
-    ])
-  }
-
   render(state: unknown): ComponentChild {
     return this.view.render(state)
   }