resolve conflicts 2

src/components/ContentBlock/ImageBlock.tsx

@@ -1,6 +1,5 @@
 import Link from 'next/link'
 import styled from '@emotion/styled'
-import Image from 'next/image'
 
 import { SearchResultItem } from '@/types/data.types'
 import { UnbodyImageBlock } from '@/lib/unbody/unbody.types'
@@ -9,17 +8,17 @@ import { GridItem } from '../Grid/Grid'
 import { PostClassType } from '../Post/Post'
 import ContentBlockHeader from './ContentBlock.Header'
 import ContentBlockBody from './ContentBlock.Body'
+import { ResponsiveImage } from '../ResponsiveImage/ResponsiveImage'
 
 type Props = Omit<SearchResultItem<UnbodyImageBlock>, 'score'>
 
 const ImageBlock = ({ doc }: Props) => {
   return (
     <CustomGridItem className="w-2">
-      <BlockLink href={`/article/${doc.document[0].slug}`}>
+      {/* TODO: order not working for images */}
+      <BlockLink href={`/article/${doc.document[0].slug}#p-${doc.order}`}>
         <Container>
-          <ImageContainer>
-            <Image fill src={doc.url} alt={doc.alt} />
-          </ImageContainer>
+          <ResponsiveImage data={doc} />
           <ContentBlockHeader
             type={PostClassType.ARTICLE}
             date={doc?.document[0].modifiedAt}

src/components/ContentBlock/TextBlock.tsx

@@ -15,7 +15,7 @@ type Props = Omit<SearchResultItem<UnbodyTextBlock>, 'score'>
 const TextBlock = ({ doc }: Props) => {
   return (
     <GridItem className="w-4">
-      <BlockLink href={`/article/${doc.document[0].slug}`}>
+      <BlockLink href={`/article/${doc.document[0].slug}#p-${doc.order}`}>
         <Container>
           <ContentBlockHeader
             type={PostClassType.ARTICLE}

src/components/RelatedContent/RelatedContent.tsx

@@ -19,7 +19,10 @@ export default function RelatedContent({ data }: Props) {
       >
         <Grid>
           {data.data.map(
-            (block: SearchResultItem<UnbodyImageBlock | UnbodyTextBlock>) => {
+            (
+              block: SearchResultItem<UnbodyImageBlock | UnbodyTextBlock>,
+              idx: number,
+            ) => {
               if (!block.doc.document || !block.doc.document[0]) return null
 
               let refArticle = null
@@ -28,9 +31,9 @@ export default function RelatedContent({ data }: Props) {
               }
               switch (block.doc.__typename) {
                 case UnbodyGraphQl.UnbodyDocumentTypeNames.TextBlock:
-                  return <TextBlock doc={block.doc} />
+                  return <TextBlock key={`text-${idx}`} doc={block.doc} />
                 case UnbodyGraphQl.UnbodyDocumentTypeNames.ImageBlock: {
-                  return <ImageBlock doc={block.doc} />
+                  return <ImageBlock key={`image-${idx}`} doc={block.doc} />
                 }
               }
             },

src/components/Tags/Tags.tsx

@@ -22,12 +22,12 @@ const Tags = ({ tags }: { tags: string[] }) => {
 
   return tags.length > 0 ? (
     <TagContainer>
-      {tags.map((tag) => (
+      {tags.map((tag, idx) => (
         <Tag
           onClick={(e) => onTagClick(e, tag)}
           size="small"
           disabled={false}
-          key={tag}
+          key={`tag-${idx}`}
         >
           {tag}
         </Tag>

src/pages/search.tsx

@@ -16,7 +16,6 @@ import { ReactNode, useEffect, useRef, useState } from 'react'
 import { SearchLayout } from '@/layouts/SearchLayout'
 import { RelatedArticles } from '@/components/RelatedArticles'
 import { RelatedContent } from '@/components/RelatedContent'
-import { Section } from '@/components/Section/Section'
 
 interface SearchPageProps {
   articles: SearchResultItem<UnbodyGoogleDoc>[]

src/queries/searchBlocks.ts

@@ -16,6 +16,7 @@ export const getSearchBlocksQuery = (args: UnbodyGetFilters = defaultArgs) =>
             text
             tagName
             classNames
+            order
             document{
               ...on GoogleDoc{
                     title
@@ -36,6 +37,7 @@ export const getSearchBlocksQuery = (args: UnbodyGetFilters = defaultArgs) =>
             width
             height
             alt
+            order
             document{
               ...on GoogleDoc{
                     title