Skip to content

Commit

Permalink
feature/add StepGuide component (#31)
Browse files Browse the repository at this point in the history
* wd

* add StepsGuide component to storyblok, update types, presets and components

* add steps guide to sanity

* add StepGuide to sanity

* enhance sanity sections preview, add StepGuide to both richtexts

* fix lock

* change cursor

* fix
  • Loading branch information
dogfrogfog authored Oct 30, 2024
1 parent 9206f81 commit 72315a9
Show file tree
Hide file tree
Showing 33 changed files with 1,172 additions and 499 deletions.
1 change: 1 addition & 0 deletions .eslintignore
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
**/*.mjs
2 changes: 0 additions & 2 deletions apps/sanity/src/contentSections/Hero/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -14,8 +14,6 @@ export default function HeroSection({ data }: IHeroSectionProps) {

const { title, text, image, links } = data;

console.log(data);

if (!title && !text?.text && !image?.image && (!links || links.length === 0))
return <EmptyBlock name="Hero Section" />;

Expand Down
14 changes: 11 additions & 3 deletions apps/sanity/src/contentSections/Hero/schema.ts
Original file line number Diff line number Diff line change
Expand Up @@ -43,8 +43,16 @@ export default {
...sectionMarginFields,
],
preview: {
prepare: () => ({
title: "Hero",
}),
select: {
title: "title",
image: "image.image",
},
prepare({ title, image }: any) {
return {
title,
subtitle: "Hero",
media: image,
};
},
},
};
28 changes: 28 additions & 0 deletions apps/sanity/src/contentSections/StepGuide/index.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
import EmptyBlock from "@shared/ui/components/EmptyBlock";

import { StepGuide as StepGuideUI } from "@shared/ui";

import { prepareImageProps } from "@/lib/adapters/prepareImageProps";
import { prepareLinkProps } from "@/lib/adapters/prepareLinkProps";
import SectionContainer from "@/components/SectionContainer";

import type { IStepsGuideProps } from "./types";

export default function StepGuide({ data }: IStepsGuideProps) {
const { items, link } = data;

if (!items || items.length === 0) {
return <EmptyBlock name="Step Guide Section" />;
}

const formattedItems = items.map((item) => ({
...item,
image: prepareImageProps(item?.image),
}));

return (
<SectionContainer sectionData={data}>
<StepGuideUI items={formattedItems} link={prepareLinkProps(link)} />
</SectionContainer>
);
}
71 changes: 71 additions & 0 deletions apps/sanity/src/contentSections/StepGuide/schema.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,71 @@
import {
CommonGroup,
commonGroups,
sectionMarginFields,
} from "@/contentSections/commonFields";
import { defineField, defineType } from "sanity";

import customImage from "@/lib/schemas/customImage";
import customLink from "@/lib/schemas/customLink";

export const stepGuideItem = defineType({
name: "stepGuideItem",
type: "object",
title: "Step Guide Item",
fields: [
defineField({
name: "number",
type: "string",
validation: (Rule) => Rule.required(),
initialValue: "01",
}),
defineField({
name: "text",
type: "string",
validation: (Rule) => Rule.required(),
initialValue: "Some text",
}),
defineField({
name: "image",
type: customImage.name,
validation: (Rule) => Rule.required(),
}),
],
});

export default {
name: "section.stepGuide",
title: "Step Guide",
type: "object",
groups: commonGroups,
fields: [
defineField({
name: "items",
type: "array",
of: [{ type: stepGuideItem.name }],
validation: (Rule) => Rule.required().min(1),
group: CommonGroup.Content,
}),
defineField({
name: "link",
type: customLink.name,
validation: (Rule) => Rule.required(),
group: CommonGroup.Content,
}),
...sectionMarginFields,
],
preview: {
select: {
number: "items.0.number",
text: "items.0.text",
image: "items.0.image.image",
},
prepare(value: any) {
return {
media: value.image,
subtitle: "Step Guide",
title: `${value.number} ${value.text}`,
};
},
},
};
7 changes: 7 additions & 0 deletions apps/sanity/src/contentSections/StepGuide/types.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
import { type SectionStepGuide } from "@/generated/extracted-types";

export interface IStepsGuideProps {
data: SectionStepGuide & {
_key: string;
};
}
8 changes: 5 additions & 3 deletions apps/sanity/src/contentSections/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,8 +7,9 @@ import Copy from "./Copy";
import Hero from "./Hero";
import LinksList from "./LinksList";
import Logos from "./Logos";
import Pricing from "./Pricing";
import StepGuide from "./StepGuide";

import Pricing from './Pricing'
// end of section imports

export const sections: Record<string, any> = {
Expand All @@ -21,8 +22,9 @@ export const sections: Record<string, any> = {
"section.simpleCarousel": SimpleCarousel,
"section.wideSimpleCarousel": WideSimpleCarousel,
"section.hero": Hero,
'section.pricing': Pricing,
// end of section object
"section.pricing": Pricing,
"section.stepGuide": StepGuide,
// end of section object
};

export function SectionRenderer(props: { section: any }) {
Expand Down
161 changes: 155 additions & 6 deletions apps/sanity/src/generated/extracted-schema.json
Original file line number Diff line number Diff line change
Expand Up @@ -325,6 +325,94 @@
}
}
},
{
"name": "section.stepGuide",
"type": "type",
"value": {
"type": "object",
"attributes": {
"_type": {
"type": "objectAttribute",
"value": {
"type": "string",
"value": "section.stepGuide"
}
},
"items": {
"type": "objectAttribute",
"value": {
"type": "array",
"of": {
"type": "object",
"attributes": {
"_key": {
"type": "objectAttribute",
"value": {
"type": "string"
}
}
},
"rest": {
"type": "inline",
"name": "stepGuideItem"
}
}
},
"optional": false
},
"link": {
"type": "objectAttribute",
"value": {
"type": "inline",
"name": "customLink"
},
"optional": false
},
"marginTop": {
"type": "objectAttribute",
"value": {
"type": "union",
"of": [
{
"type": "string",
"value": "none"
},
{
"type": "string",
"value": "base"
},
{
"type": "string",
"value": "lg"
}
]
},
"optional": false
},
"marginBottom": {
"type": "objectAttribute",
"value": {
"type": "union",
"of": [
{
"type": "string",
"value": "none"
},
{
"type": "string",
"value": "base"
},
{
"type": "string",
"value": "lg"
}
]
},
"optional": false
}
}
}
},
{
"name": "section.pricing",
"type": "type",
Expand Down Expand Up @@ -360,19 +448,19 @@
},
"optional": false
},
"extraServiceEnabled": {
"yearlyDiscountPercentage": {
"type": "objectAttribute",
"value": {
"type": "boolean"
"type": "number"
},
"optional": true
"optional": false
},
"yearlyDiscountPercentage": {
"extraServiceEnabled": {
"type": "objectAttribute",
"value": {
"type": "number"
"type": "boolean"
},
"optional": false
"optional": true
},
"extraService": {
"type": "objectAttribute",
Expand Down Expand Up @@ -1289,6 +1377,44 @@
}
}
},
{
"name": "stepGuideItem",
"type": "type",
"value": {
"type": "object",
"attributes": {
"_type": {
"type": "objectAttribute",
"value": {
"type": "string",
"value": "stepGuideItem"
}
},
"number": {
"type": "objectAttribute",
"value": {
"type": "string"
},
"optional": false
},
"text": {
"type": "objectAttribute",
"value": {
"type": "string"
},
"optional": false
},
"image": {
"type": "objectAttribute",
"value": {
"type": "inline",
"name": "customImage"
},
"optional": false
}
}
}
},
{
"name": "pricingTier",
"type": "type",
Expand Down Expand Up @@ -1986,6 +2112,14 @@
{
"type": "string",
"value": "badge"
},
{
"type": "string",
"value": "ghost"
},
{
"type": "string",
"value": "ghost-dark"
}
]
},
Expand Down Expand Up @@ -2215,6 +2349,21 @@
"type": "inline",
"name": "section.pricing"
}
},
{
"type": "object",
"attributes": {
"_key": {
"type": "objectAttribute",
"value": {
"type": "string"
}
}
},
"rest": {
"type": "inline",
"name": "section.stepGuide"
}
}
]
}
Expand Down
Loading

0 comments on commit 72315a9

Please sign in to comment.