Skip to content

Commit

Permalink
Add subsections slice
Browse files Browse the repository at this point in the history
  • Loading branch information
IhsenBouallegue committed Jun 24, 2024
1 parent 9323e6c commit b161931
Show file tree
Hide file tree
Showing 10 changed files with 455 additions and 1 deletion.
6 changes: 6 additions & 0 deletions customtypes/page/index.json
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,12 @@
"fieldset": "Slice Zone",
"config": {
"choices": {
"subsections": {
"type": "SharedSlice"
},
"projects": {
"type": "SharedSlice"
},
"article": {
"type": "SharedSlice"
}
Expand Down
143 changes: 142 additions & 1 deletion prismicio-types.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -223,7 +223,10 @@ interface HomeDocumentData {
export type HomeDocument<Lang extends string = string> =
prismic.PrismicDocumentWithoutUID<Simplify<HomeDocumentData>, "home", Lang>;

type PageDocumentDataSlicesSlice = ArticleSlice;
type PageDocumentDataSlicesSlice =
| SubsectionsSlice
| ProjectsSlice
| ArticleSlice;

/**
* Content for Page documents
Expand Down Expand Up @@ -492,6 +495,71 @@ type HeroSliceVariation = HeroSliceDefault;
*/
export type HeroSlice = prismic.SharedSlice<"hero", HeroSliceVariation>;

/**
* Primary content in *Projects → Items*
*/
export interface ProjectsSliceDefaultItem {
/**
* Name field in *Projects → Items*
*
* - **Field Type**: Text
* - **Placeholder**: *None*
* - **API ID Path**: projects.items[].name
* - **Documentation**: https://prismic.io/docs/field#key-text
*/
name: prismic.KeyTextField;

/**
* Link field in *Projects → Items*
*
* - **Field Type**: Link
* - **Placeholder**: *None*
* - **API ID Path**: projects.items[].link
* - **Documentation**: https://prismic.io/docs/field#link-content-relationship
*/
link: prismic.LinkField;

/**
* Image field in *Projects → Items*
*
* - **Field Type**: Image
* - **Placeholder**: *None*
* - **API ID Path**: projects.items[].image
* - **Documentation**: https://prismic.io/docs/field#image
*/
image: prismic.ImageField<never>;
}

/**
* Default variation for Projects Slice
*
* - **API ID**: `default`
* - **Description**: Default
* - **Documentation**: https://prismic.io/docs/slice
*/
export type ProjectsSliceDefault = prismic.SharedSliceVariation<
"default",
Record<string, never>,
Simplify<ProjectsSliceDefaultItem>
>;

/**
* Slice variation for *Projects*
*/
type ProjectsSliceVariation = ProjectsSliceDefault;

/**
* Projects Shared Slice
*
* - **API ID**: `projects`
* - **Description**: Projects
* - **Documentation**: https://prismic.io/docs/slice
*/
export type ProjectsSlice = prismic.SharedSlice<
"projects",
ProjectsSliceVariation
>;

/**
* Primary content in *Showcase → Primary*
*/
Expand Down Expand Up @@ -672,6 +740,71 @@ export type SponsorsSlice = prismic.SharedSlice<
SponsorsSliceVariation
>;

/**
* Primary content in *Subsections → Items*
*/
export interface SubsectionsSliceDefaultItem {
/**
* Name field in *Subsections → Items*
*
* - **Field Type**: Text
* - **Placeholder**: *None*
* - **API ID Path**: subsections.items[].name
* - **Documentation**: https://prismic.io/docs/field#key-text
*/
name: prismic.KeyTextField;

/**
* Link field in *Subsections → Items*
*
* - **Field Type**: Link
* - **Placeholder**: *None*
* - **API ID Path**: subsections.items[].link
* - **Documentation**: https://prismic.io/docs/field#link-content-relationship
*/
link: prismic.LinkField;

/**
* Image field in *Subsections → Items*
*
* - **Field Type**: Image
* - **Placeholder**: *None*
* - **API ID Path**: subsections.items[].image
* - **Documentation**: https://prismic.io/docs/field#image
*/
image: prismic.ImageField<never>;
}

/**
* Default variation for Subsections Slice
*
* - **API ID**: `default`
* - **Description**: Default
* - **Documentation**: https://prismic.io/docs/slice
*/
export type SubsectionsSliceDefault = prismic.SharedSliceVariation<
"default",
Record<string, never>,
Simplify<SubsectionsSliceDefaultItem>
>;

/**
* Slice variation for *Subsections*
*/
type SubsectionsSliceVariation = SubsectionsSliceDefault;

/**
* Subsections Shared Slice
*
* - **API ID**: `subsections`
* - **Description**: Subsections
* - **Documentation**: https://prismic.io/docs/slice
*/
export type SubsectionsSlice = prismic.SharedSlice<
"subsections",
SubsectionsSliceVariation
>;

/**
* Primary content in *TeamMembers → Primary*
*/
Expand Down Expand Up @@ -880,6 +1013,10 @@ declare module "@prismicio/client" {
HeroSliceDefaultPrimary,
HeroSliceVariation,
HeroSliceDefault,
ProjectsSlice,
ProjectsSliceDefaultItem,
ProjectsSliceVariation,
ProjectsSliceDefault,
ShowcaseSlice,
ShowcaseSliceDefaultPrimary,
ShowcaseSliceDefaultItem,
Expand All @@ -890,6 +1027,10 @@ declare module "@prismicio/client" {
SponsorsSliceDefaultItem,
SponsorsSliceVariation,
SponsorsSliceDefault,
SubsectionsSlice,
SubsectionsSliceDefaultItem,
SubsectionsSliceVariation,
SubsectionsSliceDefault,
TeamMembersSlice,
TeamMembersSliceDefaultPrimary,
TeamMembersSliceDefaultItem,
Expand Down
15 changes: 15 additions & 0 deletions src/components/project-card.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
export default function ProjectCard({
name,
description,
image,
link,
tags,
...props
}: { name: string; description: string; image: string; link: string; tags: string[] }) {
return (
<div className="flex flex-col">
<h2>{name}</h2>
<p>{description}</p>
</div>
);
}
46 changes: 46 additions & 0 deletions src/slices/Projects/index.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,46 @@
import Bounded from "@/components/bounded";
import { Content } from "@prismicio/client";
import { PrismicNextImage, PrismicNextLink } from "@prismicio/next";
import { SliceComponentProps } from "@prismicio/react";

/**
* Props for `Projects`.
*/
export type ProjectsProps = SliceComponentProps<Content.ProjectsSlice>;

/**
* Component for "Projects" Slices.
*/
const Projects = ({ slice }: ProjectsProps): JSX.Element => {
return (
<Bounded
data-slice-type={slice.slice_type}
data-slice-variation={slice.variation}
className="py-0 lg:py-0 md:py-0"
>
<h2 className="text-4xl font-bold mb-8">Projects</h2>
<div className="grid grid-cols-1 gap-8 md:grid-cols-2 lg:grid-cols-3">
{slice.items.map((item) => (
<div
key={item.name}
className="group flex flex-col aspect-[16/9] w-64 bg-slate-200 rounded-md relative overflow-hidden hover:shadow-lg hover:shadow-white/10 transition-shadow duration-300 cursor-pointer"
>
<PrismicNextLink
field={item.link}
className="absolute z-10 p-4 h-full flex flex-col justify-end"
>
<h3 className="text-3xl font-medium">{item.name}</h3>
</PrismicNextLink>
<PrismicNextImage
className="absolute inset-0 w-full h-full object-cover"
field={item.image}
/>
<div className="absolute inset-0 bg-gradient-to-t from-black from-20% to-transparent opacity-60 group-hover:opacity-70 transition-opacity duration-300 h-full" />
</div>
))}
</div>
</Bounded>
);
};

export default Projects;
58 changes: 58 additions & 0 deletions src/slices/Projects/mocks.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,58 @@
[
{
"__TYPE__": "SharedSliceContent",
"variation": "default",
"primary": {},
"items": [
{
"__TYPE__": "GroupItemContent",
"value": [
[
"name",
{
"__TYPE__": "FieldContent",
"value": "engineer",
"type": "Text"
}
],
[
"link",
{
"__TYPE__": "LinkContent",
"value": {
"__TYPE__": "ExternalLink",
"url": "http://google.com"
}
}
],
[
"image",
{
"origin": {
"id": "main",
"url": "https://images.unsplash.com/photo-1596195689404-24d8a8d1c6ea",
"width": 5000,
"height": 4613
},
"url": "https://images.unsplash.com/photo-1596195689404-24d8a8d1c6ea",
"width": 5000,
"height": 4613,
"edit": {
"zoom": 1,
"crop": {
"x": 0,
"y": 0
},
"background": "transparent"
},
"credits": null,
"alt": null,
"__TYPE__": "ImageContent",
"thumbnails": {}
}
]
]
}
]
}
]
42 changes: 42 additions & 0 deletions src/slices/Projects/model.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,42 @@
{
"id": "projects",
"type": "SharedSlice",
"name": "Projects",
"description": "Projects",
"variations": [
{
"id": "default",
"name": "Default",
"docURL": "...",
"version": "initial",
"description": "Default",
"imageUrl": "",
"primary": {},
"items": {
"name": {
"type": "Text",
"config": {
"label": "Name",
"placeholder": ""
}
},
"link": {
"type": "Link",
"config": {
"label": "Link",
"placeholder": "",
"select": null
}
},
"image": {
"type": "Image",
"config": {
"label": "Image",
"constraint": {},
"thumbnails": []
}
}
}
}
]
}
Loading

0 comments on commit b161931

Please sign in to comment.