diff --git a/changelog/unreleased/enhancement-resources-tiles-view b/changelog/unreleased/enhancement-resources-tiles-view index 3ca966aa8aa..a040dba0696 100644 --- a/changelog/unreleased/enhancement-resources-tiles-view +++ b/changelog/unreleased/enhancement-resources-tiles-view @@ -6,8 +6,10 @@ Tiles can be dynamically resized on screens bigger than mobile, using the "displ https://github.com/owncloud/web/pull/7991 https://github.com/owncloud/web/pull/8372 +https://github.com/owncloud/web/pull/8392 https://github.com/owncloud/web/issues/6378 https://github.com/owncloud/web/issues/6379 https://github.com/owncloud/web/issues/6380 https://github.com/owncloud/web/issues/8367 https://github.com/owncloud/web/issues/8368 +https://github.com/owncloud/web/issues/8365 diff --git a/packages/design-system/src/components/OcCheckbox/OcCheckbox.vue b/packages/design-system/src/components/OcCheckbox/OcCheckbox.vue index eeaac85ecbc..fb3739f6f2a 100644 --- a/packages/design-system/src/components/OcCheckbox/OcCheckbox.vue +++ b/packages/design-system/src/components/OcCheckbox/OcCheckbox.vue @@ -115,7 +115,8 @@ export default defineComponent({ 'oc-checkbox', 'oc-rounded', 'oc-checkbox-' + getSizeClass(this.size), - { 'oc-checkbox-outline': this.outline } + { 'oc-checkbox-outline': this.outline }, + { 'oc-checkbox-checked': this.modelValue } ] }, labelClasses() { @@ -180,12 +181,14 @@ export default defineComponent({ cursor: pointer; } - &:checked, + &-checked, + :checked, &:indeterminate { background-color: var(--oc-color-swatch-inverse-default); } - &:checked { + &-checked, + :checked { @include svg-fill($internal-form-checkbox-image, '#000', $form-radio-checked-icon-color); } diff --git a/packages/design-system/src/components/OcTile/OcTile.spec.ts b/packages/design-system/src/components/OcTile/OcTile.spec.ts index 2f7fe55075a..547a5a41654 100644 --- a/packages/design-system/src/components/OcTile/OcTile.spec.ts +++ b/packages/design-system/src/components/OcTile/OcTile.spec.ts @@ -1,38 +1,33 @@ -import { shallowMount } from 'web-test-helpers' +import { defaultPlugins, shallowMount } from 'web-test-helpers' import OcTile from './OcTile.vue' -const defaultSpace = { +const getSpaceMock = (disabled = false) => ({ name: 'Space 1', path: '', type: 'space', isFolder: true, + disabled, getDriveAliasAndItem: () => '1' -} -const disabledSpace = { - name: 'Space 1', - path: '', - type: 'space', - isFolder: true, - disabled: true, - getDriveAliasAndItem: () => '1' -} +}) describe('OcTile component', () => { it('renders default space correctly', () => { - const wrapper = getWrapper({ resource: defaultSpace }) + const wrapper = getWrapper({ resource: getSpaceMock() }) expect(wrapper.html()).toMatchSnapshot() }) it('renders disabled space correctly', () => { - const wrapper = getWrapper({ resource: disabledSpace }) + const wrapper = getWrapper({ resource: getSpaceMock(true) }) expect(wrapper.html()).toMatchSnapshot() }) + it('renders selected resource correctly', () => { + const wrapper = getWrapper({ resource: getSpaceMock(), isResourceSelected: true }) + expect(wrapper.find('.oc-tile-card-selected').exists()).toBeTruthy() + }) - function getWrapper(props = {}, slots = {}) { + function getWrapper(props = {}) { return shallowMount(OcTile, { - props: { - ...props - }, - global: { renderStubDefaultSlot: true } + props, + global: { plugins: [...defaultPlugins()], renderStubDefaultSlot: true } }) } }) diff --git a/packages/design-system/src/components/OcTile/OcTile.vue b/packages/design-system/src/components/OcTile/OcTile.vue index 169eb5cff1d..01d40e77188 100644 --- a/packages/design-system/src/components/OcTile/OcTile.vue +++ b/packages/design-system/src/components/OcTile/OcTile.vue @@ -2,36 +2,40 @@
+
+ +
- Disabled + - - - - - +
+
+ + + + +
@@ -50,10 +54,7 @@
-

+

@@ -92,17 +93,24 @@ export default defineComponent({ resourceRoute: { type: Object, default: () => {} + }, + isResourceSelected: { + type: Boolean, + required: false, + default: false } }, emits: ['click', 'contextmenu'] }) - diff --git a/packages/web-app-files/src/views/spaces/GenericSpace.vue b/packages/web-app-files/src/views/spaces/GenericSpace.vue index 9c629ece438..e9ede64cd9a 100644 --- a/packages/web-app-files/src/views/spaces/GenericSpace.vue +++ b/packages/web-app-files/src/views/spaces/GenericSpace.vue @@ -46,13 +46,14 @@ Hello, ResourceTiles footer! + +
Hello, ResourceTiles footer!
`; @@ -10,11 +11,12 @@ exports[`ResourceTiles component renders an array of spaces correctly 1`] = `
  • - +
  • - +
    • -     + +
    `; diff --git a/packages/web-app-files/tests/unit/views/spaces/__snapshots__/Projects.spec.ts.snap b/packages/web-app-files/tests/unit/views/spaces/__snapshots__/Projects.spec.ts.snap index 7a29a8d9648..f3c4f1dc1da 100644 --- a/packages/web-app-files/tests/unit/views/spaces/__snapshots__/Projects.spec.ts.snap +++ b/packages/web-app-files/tests/unit/views/spaces/__snapshots__/Projects.spec.ts.snap @@ -9,12 +9,13 @@ exports[`Projects view different files view states lists all available project s
    • - +
    • - +
      • -
    + +
    diff --git a/packages/web-pkg/src/components/ContextActions/ContextMenuQuickAction.vue b/packages/web-pkg/src/components/ContextActions/ContextMenuQuickAction.vue index 476996f6b9d..14e7446f1eb 100644 --- a/packages/web-pkg/src/components/ContextActions/ContextMenuQuickAction.vue +++ b/packages/web-pkg/src/components/ContextActions/ContextMenuQuickAction.vue @@ -17,6 +17,7 @@ :drop-id="`context-menu-drop-${resourceDomSelector(item)}`" :toggle="`#context-menu-trigger-${resourceDomSelector(item)}`" :popper-options="popperOptions" + class="oc-overflow-hidden" mode="click" close-on-click padding-size="small" diff --git a/packages/web-pkg/tests/unit/components/ContextActions/__snapshots__/ContextMenuQuickAction.spec.ts.snap b/packages/web-pkg/tests/unit/components/ContextActions/__snapshots__/ContextMenuQuickAction.spec.ts.snap index d75e8572f7c..d77edf96a89 100644 --- a/packages/web-pkg/tests/unit/components/ContextActions/__snapshots__/ContextMenuQuickAction.spec.ts.snap +++ b/packages/web-pkg/tests/unit/components/ContextActions/__snapshots__/ContextMenuQuickAction.spec.ts.snap @@ -6,7 +6,7 @@ exports[`ContextMenuQuickAction component renders component 1`] = ` -
    +
    diff --git a/sonar-project.properties b/sonar-project.properties index 4893c4a27af..ec77b18cece 100644 --- a/sonar-project.properties +++ b/sonar-project.properties @@ -32,4 +32,4 @@ sonar.pullrequest.key=${env.SONAR_PULL_REQUEST_KEY} sonar.javascript.lcov.reportPaths=coverage/lcov.info # Exclude files -sonar.exclusions=docs/**,node_modules/**,deployments/**,**/tests/**,__mocks__/**,__fixtures__/**,dist/**,changelog/**,config/**,docker/**,release/**,**/package.json,package.json,rollup.config.js,nightwatch.conf.js,Makefile,Makefile.release,CHANGELOG.md,README.md,packages/web-client/src/generated/**,packages/web-integration-oc10/** +sonar.exclusions=docs/**,node_modules/**,deployments/**,**/tests/**,**/*.spec.ts,__mocks__/**,__fixtures__/**,dist/**,changelog/**,config/**,docker/**,release/**,**/package.json,package.json,rollup.config.js,nightwatch.conf.js,Makefile,Makefile.release,CHANGELOG.md,README.md,packages/web-client/src/generated/**,packages/web-integration-oc10/**