Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(Table): respect sort prop updates from parent component #1208

Merged

Conversation

ivantopo
Copy link
Contributor

@ivantopo ivantopo commented Jan 6, 2024

πŸ”— Linked issue

Fixes #946

❓ Type of change

  • πŸ“– Documentation (updates to the documentation or readme)
  • 🐞 Bug fix (a non-breaking change that fixes an issue)
  • πŸ‘Œ Enhancement (improving an existing functionality)
  • ✨ New feature (a non-breaking change that adds functionality)
  • 🧹 Chore (updates to the build process or auxiliary tools and libraries)
  • ⚠️ Breaking change (fix or feature that would cause existing functionality to change)

πŸ“š Description

As described on #946 and demonstrated on this example, any changes to the sort prop in a parent component are not reflected on the table, except for defining the default sorting when the table component is initialized. I was made aware of reactive sorting on the table component but it only takes care of emitting update events that the parent can listen to, without bringing any changes to the sort prop on the parent to the current state of the table.

This change uses useVModel with passive: true so that if the parent provides the sort property then the table will use it, otherwise using an internal sort state as it was doing before. This fixes #946.

πŸ“ Checklist

  • I have linked an issue or discussion.
  • I have updated the documentation accordingly.

Copy link

vercel bot commented Jan 6, 2024

The latest updates on your projects. Learn more about Vercel for Git β†—οΈŽ

Name Status Preview Updated (UTC)
ui βœ… Ready (Inspect) Visit Preview Jan 9, 2024 11:19am

@benjamincanac benjamincanac changed the title fix(table): respect sort prop updates from parent component fix(Table): respect sort prop updates from parent component Jan 8, 2024
@@ -158,7 +159,7 @@ export default defineComponent({

const columns = computed(() => props.columns ?? Object.keys(props.rows[0] ?? {}).map((key) => ({ key, label: upperFirst(key), sortable: false, class: undefined })))

const sort = ref(defu({}, props.sort, { column: null, direction: 'asc' }))
const sort = useVModel(props, 'sort', emit, { passive: true, defaultValue: defu({}, props.sort, { column: null, direction: 'asc' }) })
Copy link
Member

@benjamincanac benjamincanac Jan 8, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Is deep option not necessary here?

@benjamincanac benjamincanac merged commit c6841d0 into nuxt:dev Jan 9, 2024
2 checks passed
@benjamincanac
Copy link
Member

Thanks 😊

@ivantopo
Copy link
Contributor Author

ivantopo commented Jan 9, 2024

hey @benjamincanac, thanks for the review, the fixes, and the quick merging! I'll make sure to lint before next PR πŸ˜„

Copy link
Member

No worries! πŸ˜ƒ

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

UTable: allow external sorting control via the sort prop
2 participants