diff --git a/app/components/AdditionalResources/index.tsx b/app/components/AdditionalResources/index.tsx index 1481b15..ece089e 100644 --- a/app/components/AdditionalResources/index.tsx +++ b/app/components/AdditionalResources/index.tsx @@ -1,32 +1,25 @@ -import { Box, Heading, List, ListItem } from '@chakra-ui/react'; -import { Resource } from '~/routes/series/series.types'; +import { Resource } from "~/routes/series/series.types"; +import { layout } from "../components"; -export function AdditionalResources({ - resources, -}: { - resources?: Array; -}) { - return resources ? ( - - - Additional Resources - - - - {resources?.map(resource => ( - - - {resource.title}{' '} - {resource.description && ( - - {resource.description} - )} - - - ))} - - - - ) : ( - <> - ); +export function AdditionalResources({ resources }: { resources?: Array }) { + return resources ? ( + +
+

Additional Resources

+
+ +
+
+
+ ) : ( + <> + ); } diff --git a/app/components/Channels/index.tsx b/app/components/Channels/index.tsx index 95c38f3..1403b7b 100644 --- a/app/components/Channels/index.tsx +++ b/app/components/Channels/index.tsx @@ -1,24 +1,18 @@ -import { Channel } from '~/routes/channels/channels.types'; -import { ImageGrid } from '../ImageGrid'; -import { Theme } from '../ImageGrid/imageGrid.types'; +import { Channel } from "~/routes/channels/channels.types"; +import { ImageGrid } from "../ImageGrid"; +import { Theme } from "../ImageGrid/imageGrid.types"; -export function Channels({ - channels, - theme, -}: { - channels: Array; - theme: Theme; -}) { - return ( - ({ - key: channel.uid, - link: `/channels/${channel.uid}`, - title: channel.name, - thumbnail: channel.thumbnail?.url, - }))} - /> - ); +export function Channels({ channels, theme }: { channels: Array; theme: Theme }) { + return ( + ({ + key: channel.uid, + link: `/channels/${channel.uid}`, + title: channel.name, + thumbnail: channel.thumbnail?.url, + }))} + /> + ); } diff --git a/app/components/FeaturedChannel/index.tsx b/app/components/FeaturedChannel/index.tsx index b9177f0..20b8e92 100644 --- a/app/components/FeaturedChannel/index.tsx +++ b/app/components/FeaturedChannel/index.tsx @@ -1,28 +1,25 @@ -import { Box, HStack, Text, Image } from '@chakra-ui/react'; -import YouTubePlayer from 'react-player/youtube'; -import { Channel } from '~/routes/channels/channels.types'; -import { VideoBanner } from '../VideoBanner/videoBanner'; +import YouTubePlayer from "react-player/youtube"; +import { Channel } from "~/routes/channels/channels.types"; +import { VideoBanner } from "../VideoBanner/videoBanner"; -export function FeaturedChannel({ - channel, - video, -}: { - channel: Channel; - video: string | undefined; -}) { - return ( - - - - - - {channel.description} - - - - ); +import { PrismicRichText } from "@prismicio/react"; +import { Speaker } from "~/routes/speakers/speakers.types"; +import { layout, components } from "../components"; + +export function FeaturedChannel({ channel, video }: { channel: Channel; video: string | undefined }) { + // fallback with an image? + const background = ; + return ( + + +

{channel.name}

+ {/*
+ +
*/} +
+ +
+
+
+ ); } diff --git a/app/components/Footer/index.tsx b/app/components/Footer/index.tsx deleted file mode 100644 index d70e9c5..0000000 --- a/app/components/Footer/index.tsx +++ /dev/null @@ -1,18 +0,0 @@ -import { Box, Heading } from '@chakra-ui/react'; -import { Link } from 'remix'; - -function SitemapSection() { - return ( -
- Sitemap -
    - Home - Sitemap -
-
- ); -} - -export function Footer() { - return ; -} diff --git a/app/components/Header/index.tsx b/app/components/Header/index.tsx deleted file mode 100644 index 0ae096e..0000000 --- a/app/components/Header/index.tsx +++ /dev/null @@ -1,47 +0,0 @@ -import { HamburgerIcon } from '@chakra-ui/icons'; -import { - Image, - Spacer, - HStack, - Link as ChakraLink, - Grid, - GridItem, - Icon, -} from '@chakra-ui/react'; -import { Link, NavLink } from 'remix'; - -export default function Header() { - return ( - - - - The C3 Church - Home - - - - - Messages - - - - - Series - - - {/* - - Speakers - - */} - - - - - ); -} diff --git a/app/components/ImageBox/index.tsx b/app/components/ImageBox/index.tsx deleted file mode 100644 index d337a05..0000000 --- a/app/components/ImageBox/index.tsx +++ /dev/null @@ -1,51 +0,0 @@ -import { Box, Image } from '@chakra-ui/react'; -import { Link } from 'remix'; -import { IImageBoxProps, Theme } from '../ImageGrid/imageGrid.types'; - -export function ImageBox({ - box, - theme, -}: { - box: IImageBoxProps; - theme?: Theme; -}) { - return ( - - - - - - {box.title} - - - {box.subTitle} - - - - - ); -} diff --git a/app/components/ImageGrid/imageGrid.types.ts b/app/components/ImageGrid/imageGrid.types.ts index 1719f15..c664e4b 100644 --- a/app/components/ImageGrid/imageGrid.types.ts +++ b/app/components/ImageGrid/imageGrid.types.ts @@ -1,13 +1,16 @@ +import { Channel } from "~/routes/channels/channels.types"; + export interface IImageBoxProps { - key: string; - link: string; - title: string; - thumbnail?: string; - subTitle?: string; - trailer?: string; + key: string; + link: string; + title: string; + thumbnail?: string; + subTitle?: string; + trailer?: string; + channel?: Channel; } export enum Theme { - light, - dark, + light, + dark, } diff --git a/app/components/ImageGrid/index.tsx b/app/components/ImageGrid/index.tsx index ddee7f3..4bbe6e3 100644 --- a/app/components/ImageGrid/index.tsx +++ b/app/components/ImageGrid/index.tsx @@ -1,47 +1,31 @@ -import { Box, Button, Center, Heading, SimpleGrid } from '@chakra-ui/react'; -import { Link } from 'remix'; -import { ImageBox } from '../ImageBox'; -import { IImageBoxProps, Theme } from './imageGrid.types'; +import { Link } from "remix"; +import { components, layout } from "../components"; + +import { IImageBoxProps, Theme } from "./imageGrid.types"; export function ImageGrid({ - title, - items, - theme = Theme.light, - link, + title, + items, + theme = Theme.light, + link, }: { - title: string; - items: Array; - theme?: Theme; - link?: { - label: string; - url: string; - }; + title: string; + items: Array; + theme?: Theme; + link?: { + label: string; + url: string; + }; }) { - return ( - - - {title} - - - {items.map((box, idx) => { - return ( - - ); - })} - -
- {link && ( - - - - )} -
-
- ); + return ( + <> + {items.map((box, idx) => { + return ( + + + + ); + })} + + ); } diff --git a/app/components/InfiniteHits/index.tsx b/app/components/InfiniteHits/index.tsx new file mode 100644 index 0000000..66834bd --- /dev/null +++ b/app/components/InfiniteHits/index.tsx @@ -0,0 +1,46 @@ +import * as React from "react"; +import { useState } from "react"; +import { connectInfiniteHits } from "react-instantsearch-dom"; +import { SearchIndexRecord } from "~/routes/search/search.types"; +import { SearchHit } from "../SearchHit"; + +const C3InfiniteHits = ({ + hits, + hasPrevious, + hasMore, + refinePrevious, + refineNext, +}: { + hits: SearchIndexRecord[]; + hasPrevious: boolean; + hasMore: boolean; + refinePrevious: () => void; + refineNext: () => void; +}) => { + const [playPreview, setPlayPreview] = useState(""); + + return ( +
+ {/* */} +
+ {hits.map((hit) => ( + + ))} +
+ + {hasMore && ( +
+ +
+ )} +
+ ); +}; + +export const InfiniteHits = connectInfiniteHits(C3InfiniteHits); diff --git a/app/components/Layout/index.tsx b/app/components/Layout/index.tsx deleted file mode 100644 index 2261497..0000000 --- a/app/components/Layout/index.tsx +++ /dev/null @@ -1,15 +0,0 @@ -import { Box, VStack } from '@chakra-ui/react'; -import { Footer } from '../Footer'; -import Header from '../Header'; - -export function Layout({ children }: { children: React.ReactNode }) { - return ( - -
- - {children} - -