@griddo/ax 11.10.11-rc.0 → 11.10.11

package/src/modules/Content/style.tsx

@@ -56,12 +56,12 @@ const SearchTags = styled.div`
 `;
 
 export {
-  ContentListWrapper,
-  TableWrapper,
-  PaginationWrapper,
-  EmptyWrapper,
-  ModalContent,
-  SelectWrapper,
-  NotificationWrapper,
-  SearchTags,
+	ContentListWrapper,
+	TableWrapper,
+	PaginationWrapper,
+	EmptyWrapper,
+	ModalContent,
+	SelectWrapper,
+	NotificationWrapper,
+	SearchTags,
 };

package/src/modules/Content/utils.tsx

@@ -6,191 +6,191 @@ import { IColumn, IDataPack, IPage, ISchemaField, IStructuredData } from "@ax/ty
 const schemas = config.schemas.ui;
 
 const getTemplatesFilters = (activatedDataPacks: IDataPack[]) => {
-  const activatedDataPacksIds = getActivatedDataPacksIds(activatedDataPacks);
-  const { templates } = schemas;
-
-  const staticFilters: { label: string; value: string; mode?: string }[] = Object.keys(templates)
-    .filter((templateName: string) => !Array.isArray(templates[templateName].dataPacks))
-    .map((templateName: string) => templates[templateName].type);
-
-  const uniqueStaticFilters = [...new Map(staticFilters.map((item: any) => [item.value, item])).values()];
-  const sortedUniqueFilters = uniqueStaticFilters.sort((a, b) => a.label.localeCompare(b.label));
-
-  const dataPackFilters: { label: string; value: string; mode?: string }[] = [];
-
-  Object.keys(templates)
-    .filter((templateName: string) => Array.isArray(templates[templateName].dataPacks))
-    .forEach((templateName: string) => {
-      const { type, dataPacks } = templates[templateName];
-      const isActivated = activatedDataPacksIds.some((id: string) => dataPacks.indexOf(id) >= 0);
-
-      if (isActivated) {
-        dataPacks.forEach((dataPack: string) => {
-          const currentDataPack = activatedDataPacks.find(
-            (activatedDataPack: IDataPack) => dataPack === activatedDataPack.id
-          );
-
-          if (currentDataPack) {
-            dataPackFilters.push({
-              label: currentDataPack?.title,
-              value: currentDataPack?.id,
-              mode: type.mode,
-            });
-          }
-        });
-      }
-    });
-
-  return { staticFilters: sortedUniqueFilters, dataPackFilters };
+	const activatedDataPacksIds = getActivatedDataPacksIds(activatedDataPacks);
+	const { templates } = schemas;
+
+	const staticFilters: { label: string; value: string; mode?: string }[] = Object.keys(templates)
+		.filter((templateName: string) => !Array.isArray(templates[templateName].dataPacks))
+		.map((templateName: string) => templates[templateName].type);
+
+	const uniqueStaticFilters = [...new Map(staticFilters.map((item: any) => [item.value, item])).values()];
+	const sortedUniqueFilters = uniqueStaticFilters.sort((a, b) => a.label.localeCompare(b.label));
+
+	const dataPackFilters: { label: string; value: string; mode?: string }[] = [];
+
+	Object.keys(templates)
+		.filter((templateName: string) => Array.isArray(templates[templateName].dataPacks))
+		.forEach((templateName: string) => {
+			const { type, dataPacks } = templates[templateName];
+			const isActivated = activatedDataPacksIds.some((id: string) => dataPacks.indexOf(id) >= 0);
+
+			if (isActivated) {
+				dataPacks.forEach((dataPack: string) => {
+					const currentDataPack = activatedDataPacks.find(
+						(activatedDataPack: IDataPack) => dataPack === activatedDataPack.id,
+					);
+
+					if (currentDataPack) {
+						dataPackFilters.push({
+							label: currentDataPack?.title,
+							value: currentDataPack?.id,
+							mode: type.mode,
+						});
+					}
+				});
+			}
+		});
+
+	return { staticFilters: sortedUniqueFilters, dataPackFilters };
 };
 
 const mapStructuredOptions = (options: any[]) => {
-  const pureOptions = options.filter((option: any) => !option.fromPage);
-
-  return pureOptions.map((option: any) => {
-    const { id, title, dataPacks, editable } = option;
-    return {
-      name: id,
-      value: id,
-      title,
-      type: id,
-      isData: true,
-      dataPacks,
-      editable,
-    };
-  });
+	const pureOptions = options.filter((option: any) => !option.fromPage);
+
+	return pureOptions.map((option: any) => {
+		const { id, title, dataPacks, editable } = option;
+		return {
+			name: id,
+			value: id,
+			title,
+			type: id,
+			isData: true,
+			dataPacks,
+			editable,
+		};
+	});
 };
 
 const getOptionValues = (options: IStructuredData[]) => {
-  const templatesOptionsValues: any = [];
-  const { templates } = schemas;
-
-  Object.keys(templates).forEach((schema: any) => {
-    const currSchema = templates[schema];
-    const { component, displayName, dataPacks } = currSchema;
-    const type = currSchema.type && currSchema.type.value && currSchema.type.value.toLowerCase();
-    const mode = currSchema.type && currSchema.type.mode;
-
-    !!currSchema.type &&
-      templatesOptionsValues.push({
-        name: component,
-        title: displayName,
-        type,
-        value: component,
-        mode,
-        dataPacks,
-      });
-  });
-
-  return [...templatesOptionsValues, ...mapStructuredOptions(options)];
+	const templatesOptionsValues: any = [];
+	const { templates } = schemas;
+
+	Object.keys(templates).forEach((schema: any) => {
+		const currSchema = templates[schema];
+		const { component, displayName, dataPacks } = currSchema;
+		const type = currSchema.type && currSchema.type.value && currSchema.type.value.toLowerCase();
+		const mode = currSchema.type && currSchema.type.mode;
+
+		!!currSchema.type &&
+			templatesOptionsValues.push({
+				name: component,
+				title: displayName,
+				type,
+				value: component,
+				mode,
+				dataPacks,
+			});
+	});
+
+	return [...templatesOptionsValues, ...mapStructuredOptions(options)];
 };
 
 const getOptionFilters = (options: IStructuredData[], activatedDataPacks: IDataPack[]) => {
-  const pureOptions = options.filter((option: IStructuredData) => !option.fromPage);
-  const { staticFilters, dataPackFilters } = getTemplatesFilters(activatedDataPacks);
-  const activatedDataPacksIds = getActivatedDataPacksIds(activatedDataPacks);
-
-  const mappedOptions = pureOptions.flatMap((option: IStructuredData) =>
-    option.dataPacks.reduce((acc: { label: string; value: string; isData: boolean }[], current: string) => {
-      if (activatedDataPacksIds.includes(current)) {
-        const currentDataPack = activatedDataPacks.find(
-          (activatedDataPack: IDataPack) => current === activatedDataPack.id
-        );
-        if (currentDataPack) {
-          const option = {
-            label: currentDataPack.title,
-            value: currentDataPack.id,
-            isData: true,
-          };
-          return [...acc, option];
-        }
-      }
-      return acc;
-    }, [])
-  );
-
-  const filters = [...dataPackFilters, ...mappedOptions];
-  const uniqueFilters = [...new Map(filters.map((item: any) => [item.value, item])).values()];
-  const sortedUniqueFilters = uniqueFilters.sort((a, b) => a.label.localeCompare(b.label));
-  return [...staticFilters, ...sortedUniqueFilters];
+	const pureOptions = options.filter((option: IStructuredData) => !option.fromPage);
+	const { staticFilters, dataPackFilters } = getTemplatesFilters(activatedDataPacks);
+	const activatedDataPacksIds = getActivatedDataPacksIds(activatedDataPacks);
+
+	const mappedOptions = pureOptions.flatMap((option: IStructuredData) =>
+		option.dataPacks.reduce((acc: { label: string; value: string; isData: boolean }[], current: string) => {
+			if (activatedDataPacksIds.includes(current)) {
+				const currentDataPack = activatedDataPacks.find(
+					(activatedDataPack: IDataPack) => current === activatedDataPack.id,
+				);
+				if (currentDataPack) {
+					const option = {
+						label: currentDataPack.title,
+						value: currentDataPack.id,
+						isData: true,
+					};
+					return [...acc, option];
+				}
+			}
+			return acc;
+		}, []),
+	);
+
+	const filters = [...dataPackFilters, ...mappedOptions];
+	const uniqueFilters = [...new Map(filters.map((item: any) => [item.value, item])).values()];
+	const sortedUniqueFilters = uniqueFilters.sort((a, b) => a.label.localeCompare(b.label));
+	return [...staticFilters, ...sortedUniqueFilters];
 };
 
 const getCurrentFilter = (structuredData: any, filter: any) =>
-  structuredData.filter((dataObj: any) => dataObj.id === filter)[0];
+	structuredData.filter((dataObj: any) => dataObj.id === filter)[0];
 
 const filterByStatus = (bulkSelection: number[], currentSitePages: IPage[]): Record<string, number[]> => {
-  const notPublishedItems: number[] = [];
-  const publishedItems: number[] = [];
-  const draftItems: number[] = [];
-
-  currentSitePages.forEach((page: IPage) => {
-    const { id, liveStatus, haveDraftPage } = page;
-    if (bulkSelection.includes(id)) {
-      switch (liveStatus.status) {
-        case pageStatus.OFFLINE_PENDING:
-        case pageStatus.OFFLINE:
-        case pageStatus.UPLOAD_PENDING:
-          haveDraftPage ? draftItems.push(id) : notPublishedItems.push(id);
-          break;
-        case pageStatus.PUBLISHED:
-          haveDraftPage ? draftItems.push(id) : publishedItems.push(id);
-          break;
-      }
-    }
-  });
-
-  const filteredItems = {
-    all: bulkSelection,
-    notPublished: notPublishedItems,
-    published: publishedItems,
-    drafts: draftItems,
-  };
-
-  return filteredItems;
+	const notPublishedItems: number[] = [];
+	const publishedItems: number[] = [];
+	const draftItems: number[] = [];
+
+	currentSitePages.forEach((page: IPage) => {
+		const { id, liveStatus, haveDraftPage } = page;
+		if (bulkSelection.includes(id)) {
+			switch (liveStatus.status) {
+				case pageStatus.OFFLINE_PENDING:
+				case pageStatus.OFFLINE:
+				case pageStatus.UPLOAD_PENDING:
+					haveDraftPage ? draftItems.push(id) : notPublishedItems.push(id);
+					break;
+				case pageStatus.PUBLISHED:
+					haveDraftPage ? draftItems.push(id) : publishedItems.push(id);
+					break;
+			}
+		}
+	});
+
+	const filteredItems = {
+		all: bulkSelection,
+		notPublished: notPublishedItems,
+		published: publishedItems,
+		drafts: draftItems,
+	};
+
+	return filteredItems;
 };
 
 const getSortedListStatus = (orderPointer: string, isAscending: boolean) => {
-  const sortedListStatus = {
-    isAscending,
-    sortedByTitle: orderPointer === "title",
-    sortedByURL: orderPointer === "slug",
-    sortedByDate: orderPointer === "modified",
-  };
-
-  return sortedListStatus;
+	const sortedListStatus = {
+		isAscending,
+		sortedByTitle: orderPointer === "title",
+		sortedByURL: orderPointer === "slug",
+		sortedByDate: orderPointer === "modified",
+	};
+
+	return sortedListStatus;
 };
 
 const getColumns = (
-  categoryColumns: ISchemaField[],
-  isStructuredData: boolean,
-  isGlobalPages: boolean,
-  maxColumns: number
+	categoryColumns: ISchemaField[],
+	isStructuredData: boolean,
+	isGlobalPages: boolean,
+	maxColumns: number,
 ): IColumn[] => {
-  let defaultColumns: IColumn[] = [
-    { id: "live", title: "Live", show: true, default: true },
-    { id: "status", title: "Status", show: true, default: true },
-    { id: "translation", title: "Trans.", show: true, default: true },
-  ];
-
-  if (!isStructuredData) {
-    defaultColumns = [
-      { id: "type", title: "Types", show: true, default: true },
-      ...defaultColumns,
-      { id: "seo", title: "SEO", show: true, default: true },
-    ];
-  }
-
-  let availableColumns = maxColumns - defaultColumns.length;
-
-  const extraColumns = categoryColumns.reduce((acc: IColumn[], cur: ISchemaField) => {
-    acc.push({ id: cur.key, title: cur.title, show: availableColumns > 0, default: false });
-    availableColumns = availableColumns - 1;
-    return acc;
-  }, []);
-
-  const position = isGlobalPages ? 2 : 1;
-  const columns = arrayInsert(defaultColumns, position, extraColumns);
-  return columns;
+	let defaultColumns: IColumn[] = [
+		{ id: "live", title: "Live", show: true, default: true },
+		{ id: "status", title: "Status", show: true, default: true },
+		{ id: "translation", title: "Trans.", show: true, default: true },
+	];
+
+	if (!isStructuredData) {
+		defaultColumns = [
+			{ id: "type", title: "Types", show: true, default: true },
+			...defaultColumns,
+			{ id: "seo", title: "SEO", show: true, default: true },
+		];
+	}
+
+	let availableColumns = maxColumns - defaultColumns.length;
+
+	const extraColumns = categoryColumns.reduce((acc: IColumn[], cur: ISchemaField) => {
+		acc.push({ id: cur.key, title: cur.title, show: availableColumns > 0, default: false });
+		availableColumns = availableColumns - 1;
+		return acc;
+	}, []);
+
+	const position = isGlobalPages ? 2 : 1;
+	const columns = arrayInsert(defaultColumns, position, extraColumns);
+	return columns;
 };
 
 export { getOptionValues, getOptionFilters, getCurrentFilter, filterByStatus, getSortedListStatus, getColumns };

package/src/modules/CreatePass/index.tsx

@@ -10,85 +10,85 @@ import { ICreatePasswordParams } from "@ax/types";
 import * as S from "./style";
 
 const CreatePass = (props: IProps) => {
-  const { setHistoryPush, createPassword } = props;
+	const { setHistoryPush, createPassword } = props;
 
-  const { id, token } = useParams<{ id: string; token: string }>();
+	const { id, token } = useParams<{ id: string; token: string }>();
 
-  const initState = { pass1: "", pass2: "" };
-  const [state, setState] = useState(initState);
+	const initState = { pass1: "", pass2: "" };
+	const [state, setState] = useState(initState);
 
-  const handlePass1Change = (value: string) => {
-    setState({ ...state, pass1: value });
-  };
+	const handlePass1Change = (value: string) => {
+		setState({ ...state, pass1: value });
+	};
 
-  const handlePass2Change = (value: string) => {
-    setState({ ...state, pass2: value });
-  };
+	const handlePass2Change = (value: string) => {
+		setState({ ...state, pass2: value });
+	};
 
-  const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
-    e.preventDefault();
+	const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
+		e.preventDefault();
 
-    const params = {
-      id,
-      token,
-      password: state.pass1,
-      retypedPassword: state.pass2,
-    };
+		const params = {
+			id,
+			token,
+			password: state.pass1,
+			retypedPassword: state.pass2,
+		};
 
-    const passCreated = await createPassword(id, params);
-    if (passCreated) {
-      setHistoryPush("/profile?init=true");
-    }
-  };
+		const passCreated = await createPassword(id, params);
+		if (passCreated) {
+			setHistoryPush("/profile?init=true");
+		}
+	};
 
-  const validPasswords = state.pass1.trim() !== "" && state.pass2.trim() && state.pass1 === state.pass2;
+	const validPasswords = state.pass1.trim() !== "" && state.pass2.trim() && state.pass1 === state.pass2;
 
-  return (
-    <S.Wrapper>
-      <S.Main>
-        <S.Header>
-          <S.Subtitle>Welcome to Griddo</S.Subtitle>
-          <S.Title>Create your password</S.Title>
-        </S.Header>
-        <ErrorToast />
-        <S.Form onSubmit={handleSubmit}>
-          <FieldsBehavior
-            fieldType="TextField"
-            title="Password"
-            inputType="password"
-            mandatory={true}
-            value={state.pass1}
-            onChange={handlePass1Change}
-            validators={{ mandatory: true }}
-            autoComplete="off"
-          />
-          <FieldsBehavior
-            fieldType="TextField"
-            title="Confirm your Password"
-            inputType="password"
-            mandatory={true}
-            value={state.pass2}
-            onChange={handlePass2Change}
-            validators={{ isSamePass: state.pass1, mandatory: true }}
-            autoComplete="off"
-          />
-          <Button type="submit" disabled={!validPasswords}>
-            Create and log in
-          </Button>
-        </S.Form>
-      </S.Main>
-    </S.Wrapper>
-  );
+	return (
+		<S.Wrapper>
+			<S.Main>
+				<S.Header>
+					<S.Subtitle>Welcome to Griddo</S.Subtitle>
+					<S.Title>Create your password</S.Title>
+				</S.Header>
+				<ErrorToast />
+				<S.Form onSubmit={handleSubmit}>
+					<FieldsBehavior
+						fieldType="TextField"
+						title="Password"
+						inputType="password"
+						mandatory={true}
+						value={state.pass1}
+						onChange={handlePass1Change}
+						validators={{ mandatory: true }}
+						autoComplete="off"
+					/>
+					<FieldsBehavior
+						fieldType="TextField"
+						title="Confirm your Password"
+						inputType="password"
+						mandatory={true}
+						value={state.pass2}
+						onChange={handlePass2Change}
+						validators={{ isSamePass: state.pass1, mandatory: true }}
+						autoComplete="off"
+					/>
+					<Button type="submit" disabled={!validPasswords}>
+						Create and log in
+					</Button>
+				</S.Form>
+			</S.Main>
+		</S.Wrapper>
+	);
 };
 
 interface IProps {
-  setHistoryPush(path: string): any;
-  createPassword(id: string, params: ICreatePasswordParams): Promise<boolean>;
+	setHistoryPush(path: string): any;
+	createPassword(id: string, params: ICreatePasswordParams): Promise<boolean>;
 }
 
 const mapDispatchToProps = {
-  setHistoryPush: appActions.setHistoryPush,
-  createPassword: usersActions.createPassword,
+	setHistoryPush: appActions.setHistoryPush,
+	createPassword: usersActions.createPassword,
 };
 
 export default connect(null, mapDispatchToProps)(CreatePass);

package/src/modules/CreatePass/style.tsx

@@ -6,33 +6,32 @@ export const Wrapper = styled.section`
   display: flex;
   align-items: center;
   justify-content: center;
-  background: ${p => p.theme.color.uiBackground01};
+  background: ${(p) => p.theme.color.uiBackground01};
 `;
 
 export const Main = styled.div`
-  width: calc(${p => p.theme.spacing.xl} * 5);
+  width: calc(${(p) => p.theme.spacing.xl} * 5);
 `;
 
 export const Header = styled.header`
   text-align: center;
   border-bottom: 1px solid ${(p) => p.theme.color.uiLine};
-  margin-bottom: ${p => p.theme.spacing.m};
-  padding-bottom: ${p => p.theme.spacing.m};
+  margin-bottom: ${(p) => p.theme.spacing.m};
+  padding-bottom: ${(p) => p.theme.spacing.m};
 `;
 
 export const Subtitle = styled.p`
-  ${p => p.theme.textStyle.headingXXS};
-  color: ${p => p.theme.color.textMediumEmphasis};
+  ${(p) => p.theme.textStyle.headingXXS};
+  color: ${(p) => p.theme.color.textMediumEmphasis};
   font-weight: normal;
-  margin-bottom: ${p => p.theme.spacing.xs};
+  margin-bottom: ${(p) => p.theme.spacing.xs};
 `;
 
 export const Title = styled.h1`
-  ${p => p.theme.textStyle.headingM};
+  ${(p) => p.theme.textStyle.headingM};
 `;
 
 export const Form = styled.form`
   display: flex;
   flex-direction: column;
 `;
-

package/src/modules/FileDrive/Breadcrumb/index.tsx

@@ -4,39 +4,39 @@ import { IFolderTree } from "@ax/types";
 import * as S from "./style";
 
 const Breadcrumb = (props: IBreadcrumbProps): JSX.Element => {
-  const { breadcrumb, onClick } = props;
+	const { breadcrumb, onClick } = props;
 
-  const handleRootClick = () => onClick(null);
+	const handleRootClick = () => onClick(null);
 
-  return (
-    <S.BreadcrumbGroup data-testid="file-breadcrumb">
-      <React.Fragment key="root">
-        <S.BreadcrumbItem onClick={handleRootClick} isLastItem={false}>
-          All Documents
-        </S.BreadcrumbItem>
-        {"/"}
-      </React.Fragment>
-      {breadcrumb.slice(0).map((item: IFolderTree, index: number, arr: any) => {
-        const { id, name } = item;
-        const isLastItem = breadcrumb.length === index + 1;
-        const handleClick = () => onClick(id);
+	return (
+		<S.BreadcrumbGroup data-testid="file-breadcrumb">
+			<React.Fragment key="root">
+				<S.BreadcrumbItem onClick={handleRootClick} isLastItem={false}>
+					All Documents
+				</S.BreadcrumbItem>
+				{"/"}
+			</React.Fragment>
+			{breadcrumb.slice(0).map((item: IFolderTree, index: number, arr: any) => {
+				const { id, name } = item;
+				const isLastItem = breadcrumb.length === index + 1;
+				const handleClick = () => onClick(id);
 
-        return (
-          <React.Fragment key={`${id}${index}`}>
-            <S.BreadcrumbItem onClick={handleClick} isLastItem={isLastItem}>
-              {name}
-            </S.BreadcrumbItem>
-            {index <= arr.length - 2 && "/"}
-          </React.Fragment>
-        );
-      })}
-    </S.BreadcrumbGroup>
-  );
+				return (
+					<React.Fragment key={`${id}${index}`}>
+						<S.BreadcrumbItem onClick={handleClick} isLastItem={isLastItem}>
+							{name}
+						</S.BreadcrumbItem>
+						{index <= arr.length - 2 && "/"}
+					</React.Fragment>
+				);
+			})}
+		</S.BreadcrumbGroup>
+	);
 };
 
 export interface IBreadcrumbProps {
-  breadcrumb: IFolderTree[];
-  onClick(folderID: number | null): void;
+	breadcrumb: IFolderTree[];
+	onClick(folderID: number | null): void;
 }
 
 export default Breadcrumb;

package/src/modules/FileDrive/Breadcrumb/style.tsx

@@ -4,15 +4,15 @@ const BreadcrumbGroup = styled.div`
   display: flex;
   align-items: center;
   flex-wrap: wrap;
-  padding-top: ${p => p.theme.spacing.s};
+  padding-top: ${(p) => p.theme.spacing.s};
 `;
 
-const BreadcrumbItem = styled.div<{isLastItem: boolean}>`
-  ${p => p.theme.textStyle.uiM};
-  color: ${p => p.isLastItem ? p.theme.color.textMediumEmphasis : p.theme.color.interactive01};
-  padding: 0 ${p => p.theme.spacing.xxs};
-  cursor: ${p => p.isLastItem ? "default" : "pointer"};
+const BreadcrumbItem = styled.div<{ isLastItem: boolean }>`
+  ${(p) => p.theme.textStyle.uiM};
+  color: ${(p) => (p.isLastItem ? p.theme.color.textMediumEmphasis : p.theme.color.interactive01)};
+  padding: 0 ${(p) => p.theme.spacing.xxs};
+  cursor: ${(p) => (p.isLastItem ? "default" : "pointer")};
   font-weight: 600;
 `;
 
-export { BreadcrumbGroup, BreadcrumbItem }
+export { BreadcrumbGroup, BreadcrumbItem };