@rebasepro/admin 0.7.0 → 0.8.0

package/src/preview/components/StorageThumbnail.tsx

@@ -2,7 +2,8 @@ import React, { useEffect } from "react";
 
 import { renderSkeletonImageThumbnail } from "../property_previews/SkeletonPropertyComponent";
 import { UrlComponentPreview } from "./UrlComponentPreview";
-import { ErrorView, useStorageSource } from "@rebasepro/core";
+import { ErrorView, useStorageSource, useStorageSources } from "@rebasepro/core";
+import { resolveStorageSource } from "@rebasepro/common";
 import { DownloadConfig, FileType } from "@rebasepro/types";
 import type { PreviewSize } from "../../types/components/PropertyPreviewProps";
 import { Skeleton } from "@rebasepro/ui";
@@ -12,6 +13,8 @@ type StorageThumbnailProps = {
     size: PreviewSize;
     interactive?: boolean;
     fill?: boolean;
+    /** Key of the storage source backing this property (`StorageConfig.storageSource`). */
+    storageSourceKey?: string;
 };
 
 /**
@@ -24,7 +27,8 @@ function areEqual(prevProps: StorageThumbnailProps, nextProps: StorageThumbnailP
         prevProps.storagePathOrDownloadUrl === nextProps.storagePathOrDownloadUrl &&
         prevProps.storeUrl === nextProps.storeUrl &&
         prevProps.interactive === nextProps.interactive &&
-        prevProps.fill === nextProps.fill;
+        prevProps.fill === nextProps.fill &&
+        prevProps.storageSourceKey === nextProps.storageSourceKey;
 }
 
 const URL_CACHE: Record<string, DownloadConfig> = {};
@@ -34,13 +38,26 @@ export function StorageThumbnailInternal({
     interactive,
     storagePathOrDownloadUrl,
     size,
-    fill
+    fill,
+    storageSourceKey
 }: StorageThumbnailProps) {
 
     const [error, setError] = React.useState<Error | undefined>(undefined);
-    const storage = useStorageSource();
+    const defaultStorage = useStorageSource();
+    const storageSources = useStorageSources();
+    // Resolve the per-property backend so previews of `storeUrl: false`
+    // properties pointing at a named source hit the right backend.
+    const storage = resolveStorageSource({
+        sourceKey: storageSourceKey,
+        sources: storageSources.sources,
+        defaultSource: defaultStorage
+    });
 
-    const [downloadConfig, setDownloadConfig] = React.useState<DownloadConfig>(URL_CACHE[storagePathOrDownloadUrl]);
+    // Cache key is namespaced by source so the same path on two backends
+    // does not collide.
+    const cacheKey = `${storageSourceKey ?? ""}::${storagePathOrDownloadUrl}`;
+
+    const [downloadConfig, setDownloadConfig] = React.useState<DownloadConfig>(URL_CACHE[cacheKey]);
 
     useEffect(() => {
         if (!storagePathOrDownloadUrl)
@@ -50,13 +67,13 @@ export function StorageThumbnailInternal({
             .then(function (downloadConfig) {
                 if (!unmounted) {
                     setDownloadConfig(downloadConfig);
-                    URL_CACHE[storagePathOrDownloadUrl] = downloadConfig;
+                    URL_CACHE[cacheKey] = downloadConfig;
                 }
             }).catch(setError);
         return () => {
             unmounted = true;
         };
-    }, [storagePathOrDownloadUrl]);
+    }, [storagePathOrDownloadUrl, cacheKey]);
 
     if (!storagePathOrDownloadUrl) return null;
 

package/src/types/components/PropertyPreviewProps.tsx

@@ -15,7 +15,7 @@ export interface PropertyPreviewProps<P extends Property | Property, CustomProps
      */
     propertyKey?: string;
 
-    value: any;
+    value: InferPropertyType<P> | any;
 
     /**
      * Property this display is related to, now strongly typed to P

package/src/types/fields.tsx

@@ -19,7 +19,6 @@ export type DefaultFieldConfig =
     | "multi_number_select"
     | "file_upload"
     | "multi_file_upload"
-    | "reference_as_string"
     | "reference"
     | "multi_references"
     | "relation"
@@ -51,12 +50,8 @@ export interface FieldProps<
     /**
      * Current value of this field, inferred from the property type P
      */
-    value: any;
-
-    /**
-     * Set value of field directly
-     */
-    setValue: (value: any | null, shouldValidate?: boolean) => void;
+    value: InferPropertyType<P> | any;
+    setValue: (value: InferPropertyType<P> | null | any, shouldValidate?: boolean) => void;
 
     /**
      * Set value of a different field directly

package/src/util/previews.ts

@@ -8,6 +8,25 @@ function isHiddenProperty(property: Property | undefined): boolean {
     return Boolean(property.ui?.hideFromCollection);
 }
 
+/**
+ * Returns true when the property holds file-storage content (single image,
+ * array of images, generic upload, …).  These properties are rendered by the
+ * dedicated image-slot and should NOT appear as regular preview columns.
+ */
+function isStorageProperty(property: Property | undefined): boolean {
+    if (!property) return false;
+    // Single string with storage config
+    if (property.type === "string" && property.storage) return true;
+    // String displayed as image URL
+    if (property.type === "string" && property.ui?.url === "image") return true;
+    // Array whose inner element has storage config or image URL
+    if (property.type === "array" && property.of && !Array.isArray(property.of)) {
+        const inner = property.of;
+        if (inner.type === "string" && (inner.storage || inner.ui?.url === "image")) return true;
+    }
+    return false;
+}
+
 export function getEntityPreviewKeys(
     authController: AuthController,
     targetCollection: EntityCollection<any>,
@@ -33,6 +52,7 @@ export function getEntityPreviewKeys(
             .filter(key => {
                 const property = targetCollection.properties[key];
                 return property && !isPropertyBuilder(property) && !isReferenceProperty(property) && !isHiddenProperty(property)
+                    && !isStorageProperty(property as Property)
                     && (hasExplicitOrder || !isRelationProperty(property));
             }).slice(0, limit);
     }

package/src/util/propertyConfigMapper.ts

@@ -44,10 +44,10 @@ export function mapPropertyToConfig(property: Property): CollectionPropertyConfi
         if (property.enum) {
             base.enum = mapEnumValues(property.enum);
         }
-        if (property.multiline) base.multiline = true;
+        if (property.ui?.multiline) base.multiline = true;
         if (property.ui?.previewAsTag) base.previewAsTag = true;
-        if (property.url || property.ui?.url) base.url = property.url ?? property.ui?.url;
-        if (property.ui?.markdown || property.markdown) base.markdown = true;
+        if (property.ui?.url) base.url = property.ui.url;
+        if (property.ui?.markdown) base.markdown = true;
         if (property.storage) base.storage = true;
         if (property.email) base.email = true;
     }

package/src/util/property_utils.tsx

@@ -1,6 +1,6 @@
 
 import type { Properties } from "@rebasepro/types";
-import type { EntityCollection, MapProperty, Property, PropertyConfig, StringProperty } from "@rebasepro/types";
+import type { EntityCollection, MapProperty, Property, PropertyConfig } from "@rebasepro/types";
 import React from "react";
 
 import { isPropertyBuilder } from "@rebasepro/common";
@@ -75,7 +75,6 @@ function getDefaultIconForProperty(property: Property): LucideIcon {
             if (property.ui?.url) return GlobeIcon;
             if (property.email) return MailIcon;
             if (property.ui?.multiline || property.ui?.markdown) return AlignLeftIcon;
-            if ((property as StringProperty).reference) return LinkIcon;
             return TextIcon;
         }
         case "number":