@@ -2,7 +2,7 @@ import * as React from 'react'
2 2
import { classes } from '@framework/Globals'
3 3
import * as Constructor from '@framework/Constructor'
4 4
import { TypeContext } from '@framework/TypeContext'
5 -
import { getSymbol } from '@framework/Reflection'
5 +
import { Type, getSymbol } from '@framework/Reflection'
6 6
import { FormGroup } from '@framework/Lines/FormGroup'
7 7
import { ModifiableEntity, Lite, Entity, MList, SearchMessage, EmbeddedEntity, EntityControlMessage, getToString } from '@framework/Signum.Entities'
8 8
import { IFile, FileTypeSymbol } from '../Signum.Files'
@@ -14,13 +14,13 @@ import "./Files.css"
14 14
import { EntityListBaseController, EntityListBaseProps } from '@framework/Lines/EntityListBase'
15 15
import { FetchAndRemember } from '@framework/Lines'
16 16
import { FileImage } from './FileImage';
17 -
import { useController } from '@framework/Lines/LineBase'
17 +
import { genericForwardRef, useController } from '@framework/Lines/LineBase'
18 18
import { ImageModal } from './ImageModal'
19 +
import { Aprox, AsEntity } from '@framework/Lines/EntityBase'
19 20 20 21
export { FileTypeSymbol };
21 22 22 -
interface MultiFileImageLineProps extends EntityListBaseProps {
23 -
ctx: TypeContext<MList<ModifiableEntity & IFile | Lite<IFile & Entity> | EmbeddedEntity>>;
23 +
interface MultiFileImageLineProps<V extends ModifiableEntity/* & IFile*/ | Lite</*IFile & */Entity>> extends EntityListBaseProps<V> {
24 24
download?: DownloadBehaviour;
25 25
dragAndDrop?: boolean;
26 26
dragAndDropMessage?: string;
@@ -29,13 +29,13 @@ interface MultiFileImageLineProps extends EntityListBaseProps {
29 29
configuration?: FileDownloaderConfiguration<IFile>;
30 30
imageHtmlAttributes?: React.ImgHTMLAttributes<HTMLImageElement>;
31 31
maxSizeInBytes?: number;
32 -
getFile?: (ectx: EmbeddedEntity) => ModifiableEntity & IFile | Lite<IFile & Entity>;
33 -
createEmbedded?: (file: ModifiableEntity & IFile) => Promise<EmbeddedEntity>;
32 +
getFile?: (ectx: V) => ModifiableEntity & IFile | Lite<IFile & Entity>;
33 +
createEmbedded?: (file: ModifiableEntity & IFile | Lite<IFile & Entity>) => Promise<V>;
34 34
}
35 35 36 -
export class MultiFileImageLineController extends EntityListBaseController<MultiFileImageLineProps> {
36 +
export class MultiFileImageLineController<V extends ModifiableEntity /*& IFile*/ | Lite</*IFile & */Entity>> extends EntityListBaseController<MultiFileImageLineProps<V>, V> {
37 37 38 -
overrideProps(p: MultiFileImageLineProps, overridenProps: MultiFileImageLineProps) {
38 +
overrideProps(p: MultiFileImageLineProps<V>, overridenProps: MultiFileImageLineProps<V>) {
39 39
super.overrideProps(p, overridenProps);
40 40 41 41
let pr = p.ctx.propertyRoute;
@@ -68,18 +68,14 @@ export class MultiFileImageLineController extends EntityListBaseController<Multi
68 68
this.props.createEmbedded(file)
69 69
.then(em => em && this.addElement(em));
70 70
else
71 -
this.convert(file)
71 +
this.convert(file as unknown as Aprox<V>)
72 72
.then(f => this.addElement(f));
73 73
}
74 - 75 -
defaultCreate() {
76 -
return Constructor.construct(this.props.type!.name);
77 -
}
78 74
}
79 75 80 -
export const MultiFileImageLine = React.forwardRef(function MultiFileLine(props: MultiFileImageLineProps, ref: React.Ref<MultiFileImageLineController>) {
76 +
export const MultiFileImageLine = genericForwardRef(function MultiFileLine<V extends ModifiableEntity /*& IFile*/ | Lite</*IFile &*/ Entity>>(props: MultiFileImageLineProps<V>, ref: React.Ref<MultiFileImageLineController<V>>) {
81 77 82 -
const c = useController(MultiFileImageLineController, props, ref);
78 +
const c = useController(MultiFileImageLineController<V>, props, ref);
83 79
const p = c.props;
84 80 85 81
if (c.isHidden)
@@ -95,9 +91,9 @@ export const MultiFileImageLine = React.forwardRef(function MultiFileLine(props:
95 91
{
96 92
c.getMListItemContext(p.ctx.subCtx({ formGroupStyle: "None" })).map(mlec =>
97 93
<div className="sf-file-image-container m-2" key={mlec.index}>
98 -
{p.getComponent ? p.getComponent(mlec) :
94 +
{p.getComponent ? p.getComponent(mlec as TypeContext<AsEntity<V>>) :
99 95
p.download == "None" ? <span className={classes(mlec.formControlClass, "file-control")} > {getToString(mlec.value)}</span > :
100 -
renderFile(p.getFile ? (mlec as TypeContext<EmbeddedEntity>).subCtx(p.getFile) : mlec as TypeContext<ModifiableEntity & IFile | Lite<IFile & Entity> | undefined | null>)}
96 +
renderFile(p.getFile ? mlec.subCtx(p.getFile) : mlec as unknown as TypeContext<ModifiableEntity & IFile | Lite<IFile & Entity>>)}
101 97
{!p.ctx.readOnly &&
102 98
<a href="#" title={EntityControlMessage.Remove.niceToString()}
103 99
className="sf-line-button sf-remove"
@@ -129,20 +125,19 @@ export const MultiFileImageLine = React.forwardRef(function MultiFileLine(props:
129 125
);
130 126 131 127 132 -
function renderFile(ctx: TypeContext<ModifiableEntity & IFile | Lite<IFile & Entity> | undefined | null>) {
128 +
function renderFile(ctx: TypeContext<ModifiableEntity & IFile | Lite<IFile & Entity>>) {
133 129
const val = ctx.value!;
134 130 135 131
return ctx.propertyRoute!.typeReference().isLite ?
136 132
<FetchAndRemember lite={val! as Lite<IFile & Entity>}>{file => <FileImage file={file} {...p.imageHtmlAttributes} style={{ maxWidth: "100px" }} />}</FetchAndRemember> :
137 133
<FileImage file={val as IFile & ModifiableEntity} {...p.imageHtmlAttributes} style={{ maxWidth: "100px" }} onClick={e => ImageModal.show(val as IFile & ModifiableEntity, e)} />;
138 134
}
139 - 140 135
});
141 136 142 137
(MultiFileImageLine as any).defaultProps = {
143 138
download: "SaveAs",
144 139
dragAndDrop: true
145 -
} as MultiFileImageLineProps;
140 +
} as MultiFileImageLineProps<any>;
146 141 147 142 148 143 RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4