Table Group by Title that contains single quote shows js errors in the console
ismaail opened this issue · comments
Package
filament/tables
Package Version
v3.2.86
Laravel Version
v11.10.0
Livewire Version
v3
PHP Version
PHP 8.3.8
Problem description
Table Group by Title that contains single quote shows js errors in the console
Expected behavior
No js errors in the console
Steps to reproduce
- Create a Resource Table for Post Model (that have a title attribute)
- Show Posts records in the Resource Table
- Add Group to the table
->groups([
'title'
])->defaultGroup('title')
Notice: this is just a simplified example, the actual code has a Group by relational Model, this simplified example and the actual production code both throw same error in the console.
Reproduction repository
https://github.com/ismaail/filament_issue_13153
Relevant log output
livewire.js?id=07f22875:1123 Alpine Expression Error: missing ) after argument list
Expression: "{
'hidden': false && isGroupCollapsed('50 Cent's Musical Journey: A Quiz for His Biggest Fans'),
'bg-gray-50 dark:bg-white/5': isRecordSelected('26'),
'[&>*:first-child]:relative [&>*:first-child]:before:absolute [&>*:first-child]:before:start-0 [&>*:first-child]:before:inset-y-0 [&>*:first-child]:before:w-0.5 [&>*:first-child]:before:bg-primary-600 [&>*:first-child]:dark:before:bg-primary-500': isRecordSelected('26'),
}"
<tr x-bind:class="{
'hidden': false && isGroupCollapsed('50 Cent's Musical Journey: A Quiz for His Biggest Fans'),
'bg-gray-50 dark:bg-white/5': isRecordSelected('26'),
'[&>*:first-child]:relative [&>*:first-child]:before:absolute [&>*:first-child]:before:start-0 [&>*:first-child]:before:inset-y-0 [&>*:first-child]:before:w-0.5 [&>*:first-child]:before:bg-primary-600 [&>*:first-child]:dark:before:bg-primary-500': isRecordSelected('26'),
}" class="fi-ta-row [@media(hover:hover)]:transition [@media(hover:hover)]:duration-75 hover:bg-gray-50 dark:hover:bg-white/5" wire:key="vWKbomv2GOGbRHbKtDXW.table.records.26">…</tr>
handleError @ livewire.js?id=07f22875:1123
safeAsyncFunction @ livewire.js?id=07f22875:1180
generateFunctionFromString @ livewire.js?id=07f22875:1184
generateEvaluatorFromString @ livewire.js?id=07f22875:1189
normalEvaluator @ livewire.js?id=07f22875:1154
evaluateLater @ livewire.js?id=07f22875:1144
handler2 @ livewire.js?id=07f22875:3513
flushHandlers @ livewire.js?id=07f22875:1281
stopDeferring @ livewire.js?id=07f22875:1286
deferHandlingDirectives @ livewire.js?id=07f22875:1289
initTree @ livewire.js?id=07f22875:1476
_activate @ async-alpine.js?v=3.2.86.0:1
_componentStrategy @ async-alpine.js?v=3.2.86.0:1
await in _componentStrategy (async)
_setupComponent @ async-alpine.js?v=3.2.86.0:1
_setupComponents @ async-alpine.js?v=3.2.86.0:1
start @ async-alpine.js?v=3.2.86.0:1
(anonymous) @ async-alpine.js?v=3.2.86.0:1
dispatch2 @ livewire.js?id=07f22875:1386
start @ livewire.js?id=07f22875:1418
start2 @ livewire.js?id=07f22875:8627
(anonymous) @ livewire.js?id=07f22875:9886
livewire.js?id=07f22875:1174 Uncaught SyntaxError: missing ) after argument list
at new AsyncFunction (<anonymous>)
at safeAsyncFunction (livewire.js?id=07f22875:1174:21)
at generateFunctionFromString (livewire.js?id=07f22875:1184:16)
at generateEvaluatorFromString (livewire.js?id=07f22875:1189:16)
at normalEvaluator (livewire.js?id=07f22875:1154:111)
at evaluateLater (livewire.js?id=07f22875:1144:12)
at Function.handler2 (livewire.js?id=07f22875:3513:22)
at flushHandlers (livewire.js?id=07f22875:1281:48)
at stopDeferring (livewire.js?id=07f22875:1286:7)
at deferHandlingDirectives (livewire.js?id=07f22875:1289:5)
safeAsyncFunction @ livewire.js?id=07f22875:1174
generateFunctionFromString @ livewire.js?id=07f22875:1184
generateEvaluatorFromString @ livewire.js?id=07f22875:1189
normalEvaluator @ livewire.js?id=07f22875:1154
evaluateLater @ livewire.js?id=07f22875:1144
handler2 @ livewire.js?id=07f22875:3513
flushHandlers @ livewire.js?id=07f22875:1281
stopDeferring @ livewire.js?id=07f22875:1286
deferHandlingDirectives @ livewire.js?id=07f22875:1289
initTree @ livewire.js?id=07f22875:1476
_activate @ async-alpine.js?v=3.2.86.0:1
_componentStrategy @ async-alpine.js?v=3.2.86.0:1
setTimeout (async)
handleError @ livewire.js?id=07f22875:1126
safeAsyncFunction @ livewire.js?id=07f22875:1180
generateFunctionFromString @ livewire.js?id=07f22875:1184
generateEvaluatorFromString @ livewire.js?id=07f22875:1189
normalEvaluator @ livewire.js?id=07f22875:1154
evaluateLater @ livewire.js?id=07f22875:1144
handler2 @ livewire.js?id=07f22875:3513
flushHandlers @ livewire.js?id=07f22875:1281
stopDeferring @ livewire.js?id=07f22875:1286
deferHandlingDirectives @ livewire.js?id=07f22875:1289
initTree @ livewire.js?id=07f22875:1476
_activate @ async-alpine.js?v=3.2.86.0:1
_componentStrategy @ async-alpine.js?v=3.2.86.0:1
await in _componentStrategy (async)
_setupComponent @ async-alpine.js?v=3.2.86.0:1
_setupComponents @ async-alpine.js?v=3.2.86.0:1
start @ async-alpine.js?v=3.2.86.0:1
(anonymous) @ async-alpine.js?v=3.2.86.0:1
dispatch2 @ livewire.js?id=07f22875:1386
start @ livewire.js?id=07f22875:1418
start2 @ livewire.js?id=07f22875:8627
(anonymous) @ livewire.js?id=07f22875:9886
Donate 💰 to fund this issue
- You can donate funding to this issue. We receive the money once the issue is completed & confirmed by you.
- 100% of the funding will be distributed between the Filament core team to run all aspects of the project.
- Thank you in advance for helping us make maintenance sustainable!
Please provide an actual reproduction repository that we can access.
Let us know once you've added that and we can reopen this issue.