#1720 add drag area hint

Author: iamfaran

client/packages/lowcoder/src/comps/comps/fileComp/draggerUpload.tsx

@@ -113,6 +113,7 @@ interface DraggerUploadProps {
  maxFiles: number;
  uploadType: "single" | "multiple" | "directory";
  text: string;
+ dragHintText?: string;
  dispatch: (action: CompAction) => void;
  autoHeight: boolean;
  tabIndex?: number;
@@ -237,7 +238,7 @@ export const DraggerUpload = (props: DraggerUploadProps) => {
  {props.text || trans("file.dragAreaText")}
  </p>
  <p className="ant-upload-hint">
- {trans("file.dragAreaHint")}
+ {props.dragHintText}
  </p>
  </StyledDragger>
  </DraggerShell>

client/packages/lowcoder/src/comps/comps/fileComp/fileComp.tsx

@@ -449,6 +449,7 @@ const Upload = (
  props: RecordConstructorToView<typeof commonChildren> & {
  uploadType: "single" | "multiple" | "directory";
  text: string;
+ dragHintText?: string;
  dispatch: (action: CompAction) => void;
  forceCapture: boolean;
  tabIndex?: number;
@@ -628,6 +629,7 @@ const UploadModeOptions = [
 
 const childrenMap = {
  text: withDefault(StringControl, trans("file.upload")),
+ dragHintText: withDefault(StringControl, trans("file.dragAreaHint")),
  uploadType: dropdownControl(UploadTypeOptions, "single"),
  uploadMode: dropdownControl(UploadModeOptions, "button"),
  autoHeight: withDefault(AutoHeightControl, "fixed"),
@@ -656,6 +658,10 @@ let FileTmpComp = new UICompBuilder(childrenMap, (props, dispatch) => {
  label: trans("file.uploadMode"),
  radioButton: true,
  })}
+ {children.uploadMode.getView() === "dragArea" &&
+ children.dragHintText.propertyView({
+ label: trans("file.dragHintText"),
+ })}
  {children.uploadType.propertyView({ label: trans("file.uploadType") })}
  {children.uploadMode.getView() === "dragArea" && children.autoHeight.getPropertyView()}
  </Section>

client/packages/lowcoder/src/i18n/locales/en.ts

@@ -1930,6 +1930,7 @@ export const en = {
  "uploadMode": "Upload Mode",
  "dragAreaText": "Click or drag file to this area to upload",
  "dragAreaHint": "Support for a single or bulk upload. Strictly prohibited from uploading company data or other band files.",
+ "dragHintText": "Hint Text",
  },
  "date": {
  "format": "Format",