Merge pull request #11 from ProtoDigitalUK/feature/fixes_and_tweaks

Feature/fixes and tweaks

CHANGELOG.md

@@ -1,5 +1,15 @@
 # @lucidcms/core
 
+## v0.5.0-alpha.1
+
+### Bug Fixes:
+
+- Fixed bug where field translation values where still being set on front and backend despite collections having translation set to false. ([16f1ada](https://github.com/ProtoDigitalUK/lucid/commit/16f1ada06799eb0c8e906bb1983af01c8f650c61))
+- Fixed bug in flatten fields function on backend that was dropping fields that do not have translations enabled and where the value is empty. ([449ab1d](https://github.com/ProtoDigitalUK/lucid/commit/449ab1d7915b43447c6e2821ef2063f56de5f56e))
+- Fixed issue with link select modal not clearing previously opened link on close. ([6b190a8](https://github.com/ProtoDigitalUK/lucid/commit/6b190a882dd315c31426745aa558772408247ef0))
+- Fixed document row and get field/meta helpers to use param collection translation value or brick store collection translation value. ([dfea7a0c](https://github.com/ProtoDigitalUK/lucid/commit/dfea7a0c960b7159640768a9a5152308b1978af9))
+- Fixed issue with document builder when in create mode where collection refetch on tab switch would reset field data. ([3787ce3](https://github.com/ProtoDigitalUK/lucid/commit/3787ce324a39b89fcd2be485978b0acfbe0d2140))
+
 ## v0.5.0-alpha.0
 
 ### Features:

apps/cms/src/components/Groups/Builder/BrickBody.tsx

@@ -64,13 +64,13 @@ export const BrickBody: Component<BrickProps> = (props) => {
 			<div
 				class={classNames({
 					"p-15 pt-0": props.options.padding === "15",
-					"p-15 md:p-30 pt-0": props.options.padding === "30",
-					"-mt-15": props.options.bleedTop,
+					"p-15 md:p-30": props.options.padding === "30",
+					"!pt-15": props.options.bleedTop,
 				})}
 			>
 				{/* Tabs */}
 				<Show when={allTabs().length > 0}>
-					<div class="border-b border-border mb-15 flex flex-wrap">
+					<div class="border-b border-border mb-6 flex flex-wrap">
 						<For each={allTabs()}>
 							{(tab) => (
 								<button

apps/cms/src/components/Groups/Document/BuilderBricks.tsx

@@ -119,10 +119,13 @@ const BuilderBrickRow: Component<BuilderBrickRowProps> = (props) => {
 		<li
 			data-dragkey={DRAG_DROP_KEY}
 			class={classNames(
-				"w-full bg-container-2 border border-border rounded-md mb-15 last:mb-0",
+				"w-full bg-container-2 border border-border rounded-md mb-15 last:mb-0 focus-within:outline-none focus-within:ring-1 ring-inset ring-primary-base",
 				{
 					"opacity-60":
 						props.dragDrop.getDragging()?.index === brickIndex(),
+					"ring-1 ring-inset":
+						props.dragDrop.getDraggingTarget()?.index ===
+						brickIndex(),
 				},
 			)}
 			onDragStart={(e) =>
@@ -143,13 +146,7 @@ const BuilderBrickRow: Component<BuilderBrickRowProps> = (props) => {
 			{/* Header */}
 			<div
 				class={classNames(
-					"flex items-center justify-between cursor-pointer px-15 py-2.5 focus:outline-none focus:ring-1 rounded-md ring-inset ring-primary-base",
-					{
-						"mb-15": getBrickOpen(),
-						"ring-1 ring-inset":
-							props.dragDrop.getDraggingTarget()?.index ===
-							brickIndex(),
-					},
+					"flex items-center justify-between cursor-pointer px-15 py-2.5 rounded-md focus:outline-none",
 				)}
 				onClick={toggleDropdown}
 				onKeyDown={(e) => {

apps/cms/src/components/Groups/Document/FixedBricks.tsx

@@ -63,12 +63,16 @@ const FixedBrickRow: Component<FixedBrickRowProps> = (props) => {
 	};
 
 	return (
-		<li class="w-full border-b border-border">
+		<li class="w-full border-b border-border focus-within:outline-none focus-within:ring-1 ring-inset ring-primary-base">
 			{/* Header */}
 			<div
-				class={
-					"flex justify-between cursor-pointer p-15 md:p-30 focus:outline-none focus:ring-1 ring-inset ring-primary-base"
-				}
+				class={classNames(
+					"flex justify-between cursor-pointer pt-15 px-15 md:px-30 md:pt-30 focus:outline-none",
+					{
+						"pb-0": getBrickOpen(),
+						"pb-15 md:pb-30": !getBrickOpen(),
+					},
+				)}
 				onClick={toggleDropdown}
 				onKeyDown={(e) => {
 					if (e.key === "Enter") {
@@ -81,7 +85,7 @@ const FixedBrickRow: Component<FixedBrickRowProps> = (props) => {
 				role="button"
 				tabIndex="0"
 			>
-				<h2>{config()?.title}:</h2>
+				<h2>{config()?.title}</h2>
 				<div class="flex gap-2">
 					<Builder.BrickImagePreviewButton brickConfig={config()} />
 					<button

apps/cms/src/components/Modals/CustomField/LinkSelect.tsx

@@ -31,6 +31,7 @@ const LinkSelect: Component = () => {
 			label: getLabel(),
 		});
 		linkFieldStore.set("open", false);
+		linkFieldStore.set("selectedLink", null);
 	};
 
 	// ----------------------------------
@@ -47,7 +48,10 @@ const LinkSelect: Component = () => {
 		<Modal.Root
 			state={{
 				open: open(),
-				setOpen: () => linkFieldStore.set("open", false),
+				setOpen: () => {
+					linkFieldStore.set("open", false);
+					linkFieldStore.set("selectedLink", null);
+				},
 			}}
 			options={{
 				noPadding: true,
@@ -102,6 +106,7 @@ const LinkSelect: Component = () => {
 						size="x-small"
 						onClick={() => {
 							linkFieldStore.set("open", false);
+							linkFieldStore.set("selectedLink", null);
 						}}
 					>
 						{T()("cancel")}

apps/cms/src/components/Tables/Rows/DocumentRow.tsx

@@ -62,6 +62,7 @@ const DocumentRow: Component<DocumentRowProps> = (props) => {
 						document={props.document}
 						include={props.include}
 						index={i()}
+						collectionTranslations={props.collection.translations}
 					/>
 				)}
 			</For>
@@ -78,6 +79,7 @@ const DocumentDynamicColumns: Component<{
 	document: CollectionDocumentResponse;
 	include: boolean[];
 	index: number;
+	collectionTranslations: boolean;
 }> = (props) => {
 	// ----------------------------------
 	// Memos
@@ -92,13 +94,15 @@ const DocumentDynamicColumns: Component<{
 			fieldData: fieldData(),
 			fieldConfig: props.field,
 			contentLocale: contentLocale(),
+			collectionTranslations: props.collectionTranslations,
 		});
 	});
 	const fieldMeta = createMemo(() => {
 		return brickHelpers.getFieldMeta({
 			fieldData: fieldData(),
 			fieldConfig: props.field,
 			contentLocale: contentLocale(),
+			collectionTranslations: props.collectionTranslations,
 		});
 	});
 

apps/cms/src/routes/Collections/Documents/Edit.tsx

@@ -70,6 +70,7 @@ const CollectionsDocumentsEditRoute: Component<
 			},
 		},
 		enabled: () => !!collectionKey(),
+		refetchOnWindowFocus: false,
 	});
 	const document = api.collections.document.useGetSingle({
 		queryParams: {
@@ -151,7 +152,10 @@ const CollectionsDocumentsEditRoute: Component<
 	createEffect(() => {
 		if (isSuccess()) {
 			brickStore.get.reset();
-
+			brickStore.set(
+				"collectionTranslations",
+				collection.data?.data.translations || false,
+			);
 			brickStore.get.setBricks(
 				document.data?.data,
 				collection.data?.data,

apps/cms/src/services/api/collections/useGetSingle.tsx

@@ -34,6 +34,7 @@ const useGetSingle = (params: QueryHook<QueryParams>) => {
 		get enabled() {
 			return params.enabled ? params.enabled() : true;
 		},
+		refetchOnWindowFocus: params.refetchOnWindowFocus,
 	}));
 };
 

apps/cms/src/store/brickStore.ts

@@ -35,6 +35,7 @@ type BrickStoreT = {
 			  }
 			| undefined;
 	};
+	collectionTranslations: boolean;
 	// functions
 	reset: () => void;
 	setBricks: (
@@ -103,6 +104,7 @@ const [get, set] = createStore<BrickStoreT>({
 	bricks: [],
 	fieldsErrors: [],
 	documentMutated: false,
+	collectionTranslations: false,
 	imagePreview: {
 		open: false,
 		data: undefined,
@@ -111,6 +113,7 @@ const [get, set] = createStore<BrickStoreT>({
 		set("bricks", []);
 		set("fieldsErrors", []);
 		set("documentMutated", false);
+		set("collectionTranslations", false);
 	},
 	// Bricks
 	setBricks(document, collection) {
@@ -219,7 +222,10 @@ const [get, set] = createStore<BrickStoreT>({
 
 				if (!field) return;
 
-				if (params.fieldConfig.translations === true) {
+				if (
+					params.fieldConfig.translations === true &&
+					get.collectionTranslations === true
+				) {
 					if (!field.translations) field.translations = {};
 					if (!field.meta) field.meta = {};
 
@@ -241,7 +247,10 @@ const [get, set] = createStore<BrickStoreT>({
 			type: params.fieldConfig.type,
 		};
 
-		if (params.fieldConfig.translations === true) {
+		if (
+			params.fieldConfig.translations === true &&
+			get.collectionTranslations === true
+		) {
 			for (const locale of params.locales) {
 				newField.translations = {
 					[locale]: params.fieldConfig.default,
@@ -307,7 +316,10 @@ const [get, set] = createStore<BrickStoreT>({
 						type: field.type,
 					};
 
-					if (field.translations === true) {
+					if (
+						field.translations === true &&
+						get.collectionTranslations === true
+					) {
 						for (const locale of params.locales) {
 							newField.translations = {
 								[locale]: field.default,
@@ -358,8 +370,6 @@ const [get, set] = createStore<BrickStoreT>({
 					repeaterKey: params.parentRepeaterKey,
 				});
 
-				console.log(field, params);
-
 				if (!field) return;
 				if (field.type !== "repeater") return;
 				if (field.groups === undefined) return;
@@ -396,8 +406,6 @@ const [get, set] = createStore<BrickStoreT>({
 					(group) => group.id === params.targetGroupId,
 				);
 
-				console.log(selectedIndex, targetGroupIndex);
-
 				if (selectedIndex === -1 || targetGroupIndex === -1) return;
 
 				const groupOrder = field.groups[selectedIndex].order;

apps/cms/src/utils/brick-helpers.ts

@@ -94,10 +94,17 @@ const getFieldValue = <T>(props: {
 	fieldConfig: CustomField;
 	fieldData?: FieldResponse;
 	contentLocale: string;
+	collectionTranslations?: boolean;
 }) => {
 	if (!props.fieldData) return undefined;
 
-	if (props.fieldConfig.translations === true) {
+	const collectionTranslations =
+		props.collectionTranslations ?? brickStore.get.collectionTranslations;
+
+	if (
+		props.fieldConfig.translations === true &&
+		collectionTranslations === true
+	) {
 		return props.fieldData.translations?.[props.contentLocale] as T;
 	}
 	return props.fieldData.value as T;
@@ -107,10 +114,17 @@ const getFieldMeta = <T extends FieldResponseMeta>(props: {
 	fieldConfig: CustomField;
 	fieldData?: FieldResponse;
 	contentLocale: string;
+	collectionTranslations?: boolean;
 }) => {
 	if (!props.fieldData) return undefined;
 
-	if (props.fieldConfig.translations === true) {
+	const collectionTranslations =
+		props.collectionTranslations ?? brickStore.get.collectionTranslations;
+
+	if (
+		props.fieldConfig.translations === true &&
+		collectionTranslations === true
+	) {
 		return (props.fieldData.meta as Record<string, T>)?.[
 			props.contentLocale
 		];

packages/core/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@lucidcms/core",
-	"version": "0.5.0-alpha.0",
+	"version": "0.5.0-alpha.1",
 	"description": "The core of the Lucid CMS. It's responsible for spinning up the API and serving the CMS.",
 	"type": "module",
 	"types": "./dist/index.d.ts",

packages/core/src/libs/formatters/collection-document-bricks.ts

@@ -64,6 +64,8 @@ export default class CollectionDocumentBricksFormatter {
 							builder: builder,
 							defaultLocaleCode: props.defaultLocaleCode,
 							locales: props.locales,
+							collectionTranslations:
+								props.collection.data.config.translations,
 						},
 					),
 				};
@@ -89,6 +91,8 @@ export default class CollectionDocumentBricksFormatter {
 					builder: props.collection,
 					defaultLocaleCode: props.defaultLocaleCode,
 					locales: props.locales,
+					collectionTranslations:
+						props.collection.data.config.translations,
 				}),
 			);
 	};