Skip to content

Commit

Permalink
Merge branch 'main' into react-18
Browse files Browse the repository at this point in the history
* main:
  @uppy/google-drive: refactor to ESM (#3683)
  meta: harden linter rule for JSX/ESM validation (#3681)
  meta: harden linter rules for ESM/CJS validation (#3674)
  • Loading branch information
Murderlon committed May 3, 2022
2 parents 349c5a6 + 55b2812 commit 7280111
Show file tree
Hide file tree
Showing 13 changed files with 201 additions and 168 deletions.
48 changes: 32 additions & 16 deletions .eslintrc.js
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,8 @@ module.exports = {
],
parser: '@babel/eslint-parser',
parserOptions: {
ecmaVersion: 2020,
sourceType: 'script',
ecmaVersion: 2022,
ecmaFeatures: {
jsx: true,
},
Expand Down Expand Up @@ -147,21 +148,10 @@ module.exports = {
overrides: [
{
files: [
'*.mjs',
'examples/aws-presigned-url/*.js',
'private/dev/*.js',
'private/release/*.js',
'private/remark-lint-uppy/*.js',
],
parserOptions: {
sourceType: 'module',
},
},
{
files: [
'packages/@uppy/*/src/**/*.jsx',
'packages/uppy/src/**/*.jsx',
'*.jsx',
'packages/@uppy/react-native/**/*.js',
],
parser: 'espree',
parserOptions: {
sourceType: 'module',
ecmaFeatures: {
Expand Down Expand Up @@ -197,6 +187,14 @@ module.exports = {
},
{
files: [
'*.mjs',
'e2e/clients/**/*.js',
'examples/aws-presigned-url/*.js',
'examples/bundled/*.js',
'private/dev/*.js',
'private/release/*.js',
'private/remark-lint-uppy/*.js',

// Packages that have switched to ESM sources:
'packages/@uppy/audio/src/**/*.js',
'packages/@uppy/box/src/**/*.js',
Expand All @@ -207,15 +205,20 @@ module.exports = {
'packages/@uppy/facebook/src/**/*.js',
'packages/@uppy/file-input/src/**/*.js',
'packages/@uppy/form/src/**/*.js',
'packages/@uppy/google-drive/src/**/*.js',
'packages/@uppy/svelte/src/**/*.js',
'packages/@uppy/svelte/rollup.config.js',
'packages/@uppy/vue/src/**/*.js',
],
parser: 'espree',
parserOptions: {
sourceType: 'module',
ecmaFeatures: {
jsx: false,
},
},
rules: {
'import/named': 'off', // Disabled because that rule tries and fails to parse JSX dependencies.
'no-restricted-globals': [
'error',
{
Expand All @@ -242,6 +245,19 @@ module.exports = {
'import/extensions': ['error', 'ignorePackages'],
},
},
{
files: [
// Those need looser rules, and cannot be made part of the stricter rules above.
// TODO: update those to more modern code when switch to ESM is complete
'examples/react-native-expo/*.js',
'examples/svelte-example/**/*.js',
'examples/vue/**/*.js',
'examples/vue3/**/*.js',
],
parserOptions: {
sourceType: 'module',
},
},
{
files: ['./packages/@uppy/companion/**/*.js'],
rules: {
Expand Down Expand Up @@ -416,7 +432,7 @@ module.exports = {
extends: ['plugin:cypress/recommended'],
},
{
files: ['e2e/**/*.ts', 'e2e/**/*.js'],
files: ['e2e/**/*.ts', 'e2e/**/*.js', 'e2e/**/*.jsx'],
rules: { 'import/no-extraneous-dependencies': 'off' },
},
],
Expand Down
19 changes: 19 additions & 0 deletions e2e/clients/react/App.jsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
/* eslint-disable react/react-in-jsx-scope */
import Uppy from '@uppy/core'
// eslint-disable-next-line no-unused-vars
import React from 'react'
import { Dashboard } from '@uppy/react'

import '@uppy/core/dist/style.css'
import '@uppy/dashboard/dist/style.css'

export default App

function App () {
// Ideally we test with the `useUppy` hook,
// as that's how it should be used.
// But that results in breaking the rules of hooks errors?
const uppy = new Uppy()

return <Dashboard uppy={uppy} />
}
2 changes: 1 addition & 1 deletion e2e/clients/react/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
<head>
<meta charset="utf-8"/>
<title>dashboard-react</title>
<script defer type="module" src="index.js"></script>
<script defer type="module" src="index.jsx"></script>
</head>
<body>
<div id="app"></div>
Expand Down
5 changes: 5 additions & 0 deletions e2e/clients/react/index.jsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
/* eslint-disable react/react-in-jsx-scope */
import ReactDOM from 'react-dom'
import App from './App.jsx'

ReactDOM.render(<App />, document.getElementById('app'))
1 change: 1 addition & 0 deletions packages/@uppy/google-drive/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@
"license": "MIT",
"main": "lib/index.js",
"types": "types/index.d.ts",
"type": "module",
"keywords": [
"file uploader",
"google drive",
Expand Down
4 changes: 2 additions & 2 deletions packages/@uppy/google-drive/src/DriveProviderViews.js
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
const { ProviderViews } = require('@uppy/provider-views')
import { ProviderViews } from '@uppy/provider-views'

module.exports = class DriveProviderViews extends ProviderViews {
export default class DriveProviderViews extends ProviderViews {
toggleCheckbox (e, file) {
e.stopPropagation()
e.preventDefault()
Expand Down
86 changes: 86 additions & 0 deletions packages/@uppy/google-drive/src/GoogleDrive.jsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,86 @@
import { UIPlugin } from '@uppy/core'
import { Provider } 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.id = this.opts.id || 'GoogleDrive'
this.title = this.opts.title || 'Google Drive'
Provider.initPlugin(this, opts)
this.title = this.opts.title || 'Google Drive'
this.icon = () => (
<svg
aria-hidden="true"
focusable="false"
width="32"
height="32"
viewBox="0 0 32 32"
>
<g fill="none" fillRule="evenodd">
<rect
className="uppy-ProviderIconBg"
fill="#4285F4"
width="32"
height="32"
rx="16"
/>
<path
d="M25.216 17.736L19.043 7h-6.086l6.175 10.736h6.084zm-11.275.896L10.9 24h11.723l3.04-5.368H13.942zm-1.789-10.29l-5.816 10.29L9.38 24l5.905-10.29-3.132-5.369z"
fill="#FFF"
/>
</g>
</svg>
)

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,
})

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,
})

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)
}
}
86 changes: 1 addition & 85 deletions packages/@uppy/google-drive/src/index.js
Original file line number Diff line number Diff line change
@@ -1,85 +1 @@
const { UIPlugin } = require('@uppy/core')
const { Provider } = require('@uppy/companion-client')
const { h } = require('preact')
const DriveProviderViews = require('./DriveProviderViews')

const locale = require('./locale')

module.exports = class GoogleDrive extends UIPlugin {
static VERSION = require('../package.json').version

constructor (uppy, opts) {
super(uppy, opts)
this.id = this.opts.id || 'GoogleDrive'
this.title = this.opts.title || 'Google Drive'
Provider.initPlugin(this, opts)
this.title = this.opts.title || 'Google Drive'
this.icon = () => (
<svg
aria-hidden="true"
focusable="false"
width="32"
height="32"
viewBox="0 0 32 32"
>
<g fill="none" fillRule="evenodd">
<rect
className="uppy-ProviderIconBg"
fill="#4285F4"
width="32"
height="32"
rx="16"
/>
<path
d="M25.216 17.736L19.043 7h-6.086l6.175 10.736h6.084zm-11.275.896L10.9 24h11.723l3.04-5.368H13.942zm-1.789-10.29l-5.816 10.29L9.38 24l5.905-10.29-3.132-5.369z"
fill="#FFF"
/>
</g>
</svg>
)

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,
})

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,
})

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)
}
}
export { default } from './GoogleDrive.jsx'
2 changes: 1 addition & 1 deletion packages/@uppy/google-drive/src/locale.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
module.exports = {
export default {
strings: {
pluginNameGoogleDrive: 'Google Drive',
},
Expand Down
8 changes: 4 additions & 4 deletions packages/@uppy/react-native/file-picker/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -6,10 +6,10 @@ import {
ScrollView,
TouchableOpacity,
} from 'react-native'
import takePicture from './takePicture'
import selectImage from './selectImage'
import selectDocument from './selectDocument'
import Provider from './provider'
import takePicture from './takePicture.js'
import selectImage from './selectImage.js'
import selectDocument from './selectDocument.js'
import Provider from './provider.js'

export default class UppyReactNativeFilePicker extends React.Component {
constructor () {
Expand Down
2 changes: 1 addition & 1 deletion packages/@uppy/react-native/file-picker/provider.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import React from 'react'
import Url from './url'
import Url from './url.js'

// container wrapper for providers, only Url for now
export default class UppyRNProvider extends React.Component {
Expand Down
2 changes: 1 addition & 1 deletion website/src/docs/google-drive.md
Original file line number Diff line number Diff line change
Expand Up @@ -125,7 +125,7 @@ This option correlates to the [RequestCredentials value](https://developer.mozil
<!-- eslint-disable no-restricted-globals, no-multiple-empty-lines -->

```js
module.exports = {
export default {
strings: {
pluginNameGoogleDrive: 'Google Drive',
},
Expand Down
Loading

0 comments on commit 7280111

Please sign in to comment.