Support external images in cards cover

This commit is contained in:
Nolann Biron
2025-06-26 12:33:25 +02:00
parent 5134d9e7f8
commit 0948d6977e
2 changed files with 18 additions and 6 deletions
@@ -22,7 +22,7 @@ export async function RecordCard(
const { view, record, context, block, isOffscreen } = props;
const coverFile = view.coverDefinition
? getRecordValue<string[]>(record[1], view.coverDefinition)?.[0]
? getRecordValue<ContentRef[] | string[]>(record[1], view.coverDefinition)?.[0]
: null;
const targetRef = view.targetDefinition
? (record[1].values[view.targetDefinition] as ContentRef)
@@ -30,7 +30,7 @@ export async function RecordCard(
const [cover, target] = await Promise.all([
coverFile && context.contentContext
? resolveContentRef({ kind: 'file', file: coverFile }, context.contentContext)
? resolveContentRef(getCoverFileContentRef(coverFile), context.contentContext)
: null,
targetRef && context.contentContext
? resolveContentRef(targetRef, context.contentContext)
@@ -167,3 +167,16 @@ export async function RecordCard(
return <div className={tcls(RecordCardStyles)}>{body}</div>;
}
/**
* Resolve the cover file content-ref.
* If the value is a string, it means it's a file ID (legacy).
* Otherwise, it's a content-ref (File|URL).
*/
function getCoverFileContentRef(value: ContentRef | string): ContentRef {
if (typeof value === 'string') {
return { kind: 'file', file: value };
}
return value;
}
@@ -4,10 +4,9 @@ import assertNever from 'assert-never';
/**
* Get the value for a column in a record.
*/
export function getRecordValue<T extends number | string | boolean | string[] | ContentRef>(
record: DocumentTableRecord,
definitionId: string
): T {
export function getRecordValue<
T extends number | string | boolean | string[] | ContentRef | ContentRef[],
>(record: DocumentTableRecord, definitionId: string): T {
// @ts-ignore
return record.values[definitionId];
}