Fix Media dropdown source, enable auto column width

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Vadym Samoilenko 2026-03-23 17:30:44 +00:00
parent 7aea651df5
commit 46ecfe2802

View file

@ -54,42 +54,31 @@ export default function SheetPage() {
}, [sheetId])
const columns: Handsontable.ColumnSettings[] = [
{ data: 'Number', title: '#', width: 70, readOnly: true },
{ data: 'Title', title: 'Title', width: 200 },
{
data: 'Status', title: 'Status', width: 110,
type: 'dropdown', source: STATUS_OPTIONS,
},
{
data: 'Category', title: 'Category', width: 180,
type: 'dropdown', strict: false,
},
{
data: 'Media', title: 'Media', width: 180,
type: 'dropdown', strict: false,
},
{ data: 'Sub-media', title: 'Sub-media', width: 120 },
{ data: 'Format', title: 'Format', width: 100 },
{ data: 'Supply date', title: 'Supply Date', width: 110, type: 'date', dateFormat: 'YYYY-MM-DD' },
{ data: 'Live date', title: 'Live Date', width: 110, type: 'date', dateFormat: 'YYYY-MM-DD' },
{ data: 'Language', title: 'Lang', width: 60 },
{ data: 'Number', title: '#', width: 65, readOnly: true },
{ data: 'Title', title: 'Title' },
{ data: 'Status', title: 'Status', type: 'dropdown', source: STATUS_OPTIONS },
{ data: 'Category', title: 'Category', type: 'dropdown', strict: false },
{ data: 'Media', title: 'Media', type: 'dropdown', strict: false },
{ data: 'Sub-media', title: 'Sub-media' },
{ data: 'Format', title: 'Format' },
{ data: 'Supply date', title: 'Supply Date', type: 'date', dateFormat: 'YYYY-MM-DD' },
{ data: 'Live date', title: 'Live Date', type: 'date', dateFormat: 'YYYY-MM-DD' },
{ data: 'Language', title: 'Lang', width: 55 },
{ data: 'Country', title: 'Country', width: 70 },
]
const cells = useCallback((row: number, col: number): Handsontable.CellMeta => {
if (col === 3) {
// Category — source from admin dropdowns
return { source: categories.map(c => c.name) }
}
if (col === 4) {
// Media — filter based on current row's Category
const hot = hotRef.current?.hotInstance
const category = hot?.getDataAtRowProp(row, 'Category') as string | undefined
// Read Category from deliverables directly — hotInstance may not be ready yet
const category = deliverables[row]?.Category
const cat = categories.find(c => c.name === category)
return { source: cat?.mediaTypes ?? [] }
}
return {}
}, [categories])
}, [categories, deliverables])
const handleAfterChange = useCallback((changes: Handsontable.CellChange[] | null) => {
if (!changes) return
@ -239,7 +228,7 @@ export default function SheetPage() {
stretchH="last"
themeName="ht-theme-main-dark"
autoRowSize={false}
autoColumnSize={false}
autoColumnSize={{ syncLimit: '100%' }}
/>
)}
</div>