diff --git a/jest.config.js b/jest.config.js index 1fd6d8fbe..d061538d0 100644 --- a/jest.config.js +++ b/jest.config.js @@ -36,7 +36,7 @@ module.exports = { '@looker/api-explorer/src/utils': '/packages/api-explorer/src/utils', '@looker/sdk-codegen-utils/src': '/packages/sdk-codegen-utils/src', - '@looker/((?!components-test-utils|components|design|icons|chatty)(.+))$': + '@looker/((?!components-test-utils|components|design|icons|chatty|i18n)(.+))$': '/packages/$1/src', '\\.(css)$': '/config/jest/styleMock.js', '\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$': diff --git a/packages/api-explorer/package.json b/packages/api-explorer/package.json index 14cabfca8..5b91b8c1c 100644 --- a/packages/api-explorer/package.json +++ b/packages/api-explorer/package.json @@ -69,9 +69,8 @@ }, "dependencies": { "@looker/code-editor": "^0.1.23", - "@looker/components": "^2.8.1", - "@looker/components-date": "^2.4.1", - "@looker/design-tokens": "^2.7.1", + "@looker/components": "^3.0.8", + "@looker/design-tokens": "^2.7.21", "@looker/extension-utils": "^0.1.13", "@looker/icons": "^1.5.3", "@looker/redux": "0.0.0", diff --git a/packages/code-editor/package.json b/packages/code-editor/package.json index aabc7e1d6..958084eea 100644 --- a/packages/code-editor/package.json +++ b/packages/code-editor/package.json @@ -49,8 +49,8 @@ "webpack-cli": "^3.3.11" }, "dependencies": { - "@looker/components": "^2.8.1", - "@looker/design-tokens": "^2.7.1", + "@looker/components": "^3.0.8", + "@looker/design-tokens": "^2.7.21", "prism-react-renderer": "^1.2.0", "react": "^16.13.1", "react-dom": "^16.13.1", diff --git a/packages/extension-api-explorer/package.json b/packages/extension-api-explorer/package.json index dca5b4195..874b42e1d 100644 --- a/packages/extension-api-explorer/package.json +++ b/packages/extension-api-explorer/package.json @@ -16,7 +16,7 @@ }, "dependencies": { "@looker/api-explorer": "^0.9.36", - "@looker/components": "^2.8.1", + "@looker/components": "^3.0.8", "@looker/extension-sdk": "^22.10.1", "@looker/extension-sdk-react": "^22.10.1", "@looker/extension-utils": "^0.1.13", diff --git a/packages/extension-playground/package.json b/packages/extension-playground/package.json index 0a94dd95d..a8d21d70b 100644 --- a/packages/extension-playground/package.json +++ b/packages/extension-playground/package.json @@ -15,7 +15,7 @@ "@looker/extension-sdk": "^22.4.2", "@looker/extension-sdk-react": "^22.4.2", "@looker/sdk": "^22.4.2", - "@looker/components": "^2.8.1", + "@looker/components": "^3.0.8", "@looker/icons": "^1.5.3", "@styled-icons/material": "^10.28.0", "@styled-icons/material-outlined": "^10.28.0", diff --git a/packages/extension-utils/package.json b/packages/extension-utils/package.json index fdf3a7457..dbe5db9ee 100644 --- a/packages/extension-utils/package.json +++ b/packages/extension-utils/package.json @@ -25,7 +25,7 @@ "watch": "yarn lerna exec --scope @looker/extension-utils --stream 'BABEL_ENV=build babel src --root-mode upward --out-dir lib/esm --source-maps --extensions .ts,.tsx --no-comments --watch'" }, "dependencies": { - "@looker/components": "^2.8.1", + "@looker/components": "^3.0.8", "@looker/extension-sdk": "^22.10.1", "@looker/extension-sdk-react": "^22.10.1", "@looker/sdk-rtl": "^21.3.4", diff --git a/packages/hackathon/package.json b/packages/hackathon/package.json index 7bc5e531f..25e6a6423 100644 --- a/packages/hackathon/package.json +++ b/packages/hackathon/package.json @@ -35,7 +35,7 @@ }, "dependencies": { "@looker/code-editor": "^0.1.23", - "@looker/components": "^2.8.1", + "@looker/components": "^3.0.8", "@looker/extension-sdk": "^22.10.1", "@looker/extension-sdk-react": "^22.10.1", "@looker/extension-utils": "^0.1.13", diff --git a/packages/run-it/package.json b/packages/run-it/package.json index a2f25bb2b..e0d166802 100644 --- a/packages/run-it/package.json +++ b/packages/run-it/package.json @@ -52,9 +52,8 @@ }, "dependencies": { "@looker/code-editor": "^0.1.23", - "@looker/components": "^2.8.1", - "@looker/components-date": "^2.4.1", - "@looker/design-tokens": "^2.7.1", + "@looker/components": "^3.0.8", + "@looker/design-tokens": "^2.7.21", "@looker/extension-utils": "^0.1.13", "@looker/icons": "^1.5.3", "@looker/sdk": "^22.10.1", diff --git a/packages/run-it/src/components/RequestForm/RequestForm.spec.tsx b/packages/run-it/src/components/RequestForm/RequestForm.spec.tsx index 2711faa09..b2f2e9f64 100644 --- a/packages/run-it/src/components/RequestForm/RequestForm.spec.tsx +++ b/packages/run-it/src/components/RequestForm/RequestForm.spec.tsx @@ -29,14 +29,12 @@ import { renderWithTheme } from '@looker/components-test-utils' import { act, screen, waitFor } from '@testing-library/react' import userEvent from '@testing-library/user-event' -import { formatDateString } from '@looker/components-date' import type { RunItInput } from '../..' import { runItNoSet } from '../..' import { RequestForm } from './RequestForm' describe('RequestForm', () => { const run = 'Run' - // const mockSdk = {} as unknown as IAPIMethods let requestContent = {} const setRequestContent = jest.fn((content) => { requestContent = content @@ -47,6 +45,10 @@ describe('RequestForm', () => { jest.resetAllMocks() }) + afterEach(() => { + requestContent = {} + }) + describe('validation messages', () => { test('validation errors are displayed', () => { const message = 'Invalid message' @@ -178,22 +180,9 @@ describe('RequestForm', () => { }) }) - /** Return time that matches day picker in calendar */ - const noon = () => { - const now = new Date() - return new Date( - now.getFullYear(), - now.getMonth(), - now.getDate(), - 12, - 0, - 0, - 0 - ) - } - test('interacting with a date picker changes the request content', async () => { const name = 'date_item' + requestContent = { [name]: new Date('Aug 30, 2022') } renderWithTheme( { /> ) - const button = screen.getByRole('button', { name: 'Choose' }) - expect(button).toBeInTheDocument() - userEvent.click(button) - await waitFor(() => { - const today = noon() - const pickName = formatDateString(today, undefined, 'iii PP') - const cell = screen.getByRole('gridcell', { - name: pickName, - }) - userEvent.click(cell) - expect(setRequestContent).toHaveBeenLastCalledWith({ [name]: today }) + const calendar = screen.getByText('Open calendar') + userEvent.click(calendar) + + const date = screen.getAllByText('15')[1] + userEvent.click(date) + expect(setRequestContent).toHaveBeenLastCalledWith({ + [name]: new Date('Aug 15, 2022 00:00:00 AM'), }) }) diff --git a/packages/run-it/src/components/RequestForm/formUtils.spec.tsx b/packages/run-it/src/components/RequestForm/formUtils.spec.tsx index 4af6b7c20..f4d5119f0 100644 --- a/packages/run-it/src/components/RequestForm/formUtils.spec.tsx +++ b/packages/run-it/src/components/RequestForm/formUtils.spec.tsx @@ -211,11 +211,8 @@ describe('Simple Items', () => { test('it creates a datetime item', async () => { renderWithTheme(DateItem) - const button = screen.getByRole('button', { name: 'Choose' }) - userEvent.click(button) - await waitFor(() => { - expect(screen.getByTestId('text-input')).toBeInTheDocument() - }) + expect(screen.getByTestId('text-input')).toBeInTheDocument() + expect(screen.getByText('Open calendar')).toBeInTheDocument() }) }) diff --git a/packages/run-it/src/components/RequestForm/formUtils.tsx b/packages/run-it/src/components/RequestForm/formUtils.tsx index 6a109cc78..2d37ab7b2 100644 --- a/packages/run-it/src/components/RequestForm/formUtils.tsx +++ b/packages/run-it/src/components/RequestForm/formUtils.tsx @@ -30,17 +30,14 @@ import { ToggleSwitch, Label, FieldCheckbox, - ButtonOutline, - Box, - Popover, InputText, Tooltip, Icon, + InputDate, Space, } from '@looker/components' // eslint-disable-next-line no-restricted-imports import { Info } from '@styled-icons/material' -import { DateFormat, InputDate } from '@looker/components-date' import { CodeEditor } from '@looker/code-editor' import type { RunItInput, RunItValues } from '../../RunIt' import { FormItem } from './FormItem' @@ -59,31 +56,12 @@ const createDateItem = ( requestContent: RunItValues ) => ( - - - - } - > - - {name in requestContent ? ( - - {name in requestContent ? requestContent[name] : undefined} - - ) : ( - 'Choose' - )} - - + ) diff --git a/yarn.lock b/yarn.lock index 5214fbfde..4ad267cde 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2301,27 +2301,13 @@ debug "^2.2.0" es6-promise "^4.2.8" -"@looker/components-date@^2.4.1": - version "2.4.1" - resolved "https://registry.yarnpkg.com/@looker/components-date/-/components-date-2.4.1.tgz#2b410ff60590ea6fc12fabd49cb7bb24a791cc58" - integrity sha512-NYWaEqpCIuFWz9Klb9IjEldTYqA6TtGc1sBicYRiHV95/TN+IqX3xn2aY4l24ngeaB/Gb4Nzq6Yfn5rz0/iLvQ== - dependencies: - "@looker/components" "^2.8.1" - "@looker/design-tokens" "^2.7.1" - "@styled-icons/material-rounded" "10.34.0" - date-fns "2.24.0" - date-fns-tz "^1.0.12" - i18next "20.3.1" - lodash "^4.17.20" - react-day-picker "^7.4.8" - react-i18next "11.8.15" - -"@looker/components-providers@^1.5.5": - version "1.5.5" - resolved "https://registry.yarnpkg.com/@looker/components-providers/-/components-providers-1.5.5.tgz#4086972bc2ad1e8c19f78d8c2b681bc8bdfc0c55" - integrity sha512-TMvgruxypeGTwnR/P7aciPKTHZac3DSASIF1s3Mf+qaLebzsp1EyW6mAAuERnvqE0AMgXeygJY3B3W1f17lqbw== +"@looker/components-providers@^1.5.26": + version "1.5.26" + resolved "https://registry.yarnpkg.com/@looker/components-providers/-/components-providers-1.5.26.tgz#4c50fb3f92e22d348662409739311fd39c47c742" + integrity sha512-ELYfQp1G5AZPkgFNzPYr9Zm4hiGJFEpVWAMhV1KYZy/6eapqv5IEwheIQl/eXg4iP9aRVMDexsvhe2EsYxFiUA== dependencies: - "@looker/design-tokens" "^2.7.1" + "@looker/design-tokens" "^2.7.21" + "@looker/i18n" "^0.1.8" i18next "20.3.1" react-helmet-async "^1.0.9" react-i18next "11.8.15" @@ -2332,13 +2318,14 @@ resolved "https://registry.yarnpkg.com/@looker/components-test-utils/-/components-test-utils-1.5.26.tgz#ed3b20e260577b255fe30f5683e57b32b71dab86" integrity sha512-1gDeeO0mpEzEaqkfDfa9T0LYXOAr/R8gcDsptoL6HfPvwV6bVj8A9+0xBcHYfF3b/wCBE1k7Wo8W/SEuf74rww== -"@looker/components@^2.8.1": - version "2.8.1" - resolved "https://registry.yarnpkg.com/@looker/components/-/components-2.8.1.tgz#caec5941243d5d38ab83cc37571c54c15f7cb178" - integrity sha512-egY2ojOxBvQ6snn141j4DVx1JeLXI4cTc5NgWwgE1ZbWaeotLWBem/u+ETcDQ9j+7Jobn4c1c62CI15YMNayeQ== +"@looker/components@^3.0.8": + version "3.0.8" + resolved "https://registry.yarnpkg.com/@looker/components/-/components-3.0.8.tgz#d76e04238cf718993fb31b2d370843da13fecce3" + integrity sha512-83T182xWVNdgKTqeGUplDY2AulaVBClUE6Qe+d4Hj8Yi3Py4FGoyfaigA1HDFZBqtIAPqQCOi1ijp1CsGwbUbg== dependencies: - "@looker/components-providers" "^1.5.5" - "@looker/design-tokens" "^2.7.1" + "@looker/components-providers" "^1.5.26" + "@looker/design-tokens" "^2.7.21" + "@looker/i18n" "^0.1.8" "@popperjs/core" "^2.6.0" "@styled-icons/material" "10.34.0" "@styled-icons/material-outlined" "10.34.0" @@ -2346,6 +2333,8 @@ "@styled-icons/styled-icon" "^10.6.3" d3-color "^2.0.0" d3-hsv "^0.1.0" + date-fns "^2.10.0" + date-fns-tz "^1.0.12" hotkeys-js "^3.8.3" i18next "20.3.1" react-hotkeys-hook "2.3.1" @@ -2353,10 +2342,10 @@ resize-observer-polyfill "^1.5.1" uuid "^8.3.2" -"@looker/design-tokens@^2.7.1": - version "2.7.1" - resolved "https://registry.yarnpkg.com/@looker/design-tokens/-/design-tokens-2.7.1.tgz#3d490394e5c5e39d44b38c684ffa5b4477371869" - integrity sha512-4jAVG6YZfeMl2v/4haokCUNGyXBiXp94xcTzNMsMYczlY6izT+2GelqrRrwaHbEIGU/+1qfo8EsVAJRmopWdwA== +"@looker/design-tokens@^2.7.21": + version "2.7.21" + resolved "https://registry.yarnpkg.com/@looker/design-tokens/-/design-tokens-2.7.21.tgz#42894307b3451f206f7445b4bfeaa1649081c0c0" + integrity sha512-Bmd0pk9Vn29INsgvhZD69xjnMs+sG2SadHwZZObpn6jC4nNJBv1jnivvrEiSQUdsbLOgLH0k2UUVIxKfQAA1mw== dependencies: "@styled-system/props" "^5.1.5" "@styled-system/should-forward-prop" "5.1.5" @@ -2391,6 +2380,15 @@ eslint-plugin-testing-library "4.11.0" typescript "4.4.2" +"@looker/i18n@^0.1.8": + version "0.1.8" + resolved "https://registry.yarnpkg.com/@looker/i18n/-/i18n-0.1.8.tgz#ce88bd7c0403b873cdfa39b8e1df5b518d9736e0" + integrity sha512-D01XLV0uPKrUybcMOPhbj+89NdfJfpgi7e+l0luCaQuX9fguQAmZWvFm/iK6q83KCLmX/Yne4E7JH2jVGCVP0g== + dependencies: + date-fns "2.24.0" + i18next "20.3.1" + react-i18next "11.8.15" + "@looker/icons@^1.5.3": version "1.5.3" resolved "https://registry.yarnpkg.com/@looker/icons/-/icons-1.5.3.tgz#0815625b7d9b28409b4edd8714a5b93d5f17e267" @@ -5654,19 +5652,19 @@ data-urls@^2.0.0: whatwg-url "^8.0.0" date-fns-tz@^1.0.12, date-fns-tz@^1.1.6: - version "1.1.6" - resolved "https://registry.yarnpkg.com/date-fns-tz/-/date-fns-tz-1.1.6.tgz#93cbf354e2aeb2cd312ffa32e462c1943cf20a8e" - integrity sha512-nyy+URfFI3KUY7udEJozcoftju+KduaqkVfwyTIE0traBiVye09QnyWKLZK7drRr5h9B7sPJITmQnS3U6YOdQg== + version "1.3.6" + resolved "https://registry.yarnpkg.com/date-fns-tz/-/date-fns-tz-1.3.6.tgz#4195a58a2f86eda55ea69fb477f3ed8a6e2188ac" + integrity sha512-C8q7mErvG4INw1ZwAFmPlGjEo5Sv4udjKVbTc03zpP9cu6cp5AemFzKhz0V68LGcWEtX5mJudzzg3G04emIxLA== date-fns@2.24.0: version "2.24.0" resolved "https://registry.yarnpkg.com/date-fns/-/date-fns-2.24.0.tgz#7d86dc0d93c87b76b63d213b4413337cfd1c105d" integrity sha512-6ujwvwgPID6zbI0o7UbURi2vlLDR9uP26+tW6Lg+Ji3w7dd0i3DOcjcClLjLPranT60SSEFBwdSyYwn/ZkPIuw== -date-fns@^2.0.1, date-fns@^2.25.0: - version "2.25.0" - resolved "https://registry.yarnpkg.com/date-fns/-/date-fns-2.25.0.tgz#8c5c8f1d958be3809a9a03f4b742eba894fc5680" - integrity sha512-ovYRFnTrbGPD4nqaEqescPEv1mNwvt+UTqI3Ay9SzNtey9NZnYu6E2qCcBBgJ6/2VF1zGGygpyTDITqpQQ5e+w== +date-fns@^2.0.1, date-fns@^2.10.0, date-fns@^2.25.0: + version "2.29.2" + resolved "https://registry.yarnpkg.com/date-fns/-/date-fns-2.29.2.tgz#0d4b3d0f3dff0f920820a070920f0d9662c51931" + integrity sha512-0VNbwmWJDS/G3ySwFSJA3ayhbURMTJLtwM2DTxf9CWondCnh6DTNlO9JgRSq6ibf4eD0lfMJNBxUdEAHHix+bA== dateformat@^3.0.0: version "3.0.3" @@ -12252,13 +12250,6 @@ raw-body@2.4.0: iconv-lite "0.4.24" unpipe "1.0.0" -react-day-picker@^7.4.8: - version "7.4.10" - resolved "https://registry.yarnpkg.com/react-day-picker/-/react-day-picker-7.4.10.tgz#d3928fa65c04379ad28c76de22aa85374a8361e1" - integrity sha512-/QkK75qLKdyLmv0kcVzhL7HoJPazoZXS8a6HixbVoK6vWey1Od1WRLcxfyEiUsRfccAlIlf6oKHShqY2SM82rA== - dependencies: - prop-types "^15.6.2" - react-diff-viewer@^3.1.1: version "3.1.1" resolved "https://registry.yarnpkg.com/react-diff-viewer/-/react-diff-viewer-3.1.1.tgz#21ac9c891193d05a3734bfd6bd54b107ee6d46cc"