Merge pull request #2420 from NDLANO/refactor/support-node-search-result

refactor: support node search results
NDLANO · Mar 11, 2025 · e022dcb · e022dcb
2 parents 54e64c4 + 2c8a254
commit e022dcb
Show file tree

Hide file tree

Showing 9 changed files with 185 additions and 63 deletions.
diff --git a/src/containers/FilmFrontpage/AllMoviesAlphabetically.tsx b/src/containers/FilmFrontpage/AllMoviesAlphabetically.tsx
@@ -63,7 +63,9 @@ const LETTER_REGEXP = /[A-Z\WÆØÅ]+/;
 type MovieType = NonNullable<GQLAllMoviesQuery["searchWithoutPagination"]>["results"][0];
 
 const groupMovies = (movies: MovieType[]) => {
-  const sortedMovies = movies.toSorted((a, b) => a.title.localeCompare(b.title, "nb"));
+  const sortedMovies: Exclude<MovieType, { __typename: "NodeSearchResult" | undefined }>[] = movies
+    .filter((movie) => movie.__typename !== "NodeSearchResult")
+    .toSorted((a, b) => a.title.localeCompare(b.title, "nb"));
 
   const grouped = sortedMovies.reduce<Record<string, MovieType[]>>((acc, movie) => {
     const firstChar = movie.title[0]?.toUpperCase() ?? "";
@@ -152,9 +154,10 @@ const AllMoviesAlphabetically = () => {
             const context = movie.contexts.find((c) => c.rootId === FILM_ID);
             return (
               <StyledSafeLink to={context?.url ?? ""} key={movie.id}>
-                {!!movie.metaImage?.url && (
-                  <MovieImage alt="" loading="lazy" sizes={"100px"} src={movie.metaImage.url} />
-                )}
+                {(movie.__typename === "ArticleSearchResult" || movie.__typename === "LearningpathSearchResult") &&
+                  !!movie.metaImage?.url && (
+                    <MovieImage alt="" loading="lazy" sizes={"100px"} src={movie.metaImage.url} />
+                  )}
                 <MovieTextWrapper>
                   <Heading textStyle="title.small" asChild consumeCss data-title="">
                     <h3>{movie.title}</h3>
@@ -184,8 +187,15 @@ const allMoviesQuery = gql`
       results {
         id
         metaDescription
-        metaImage {
-          url
+        ... on ArticleSearchResult {
+          metaImage {
+            url
+          }
+        }
+        ... on LearningpathSearchResult {
+          metaImage {
+            url
+          }
         }
         title
         contexts {

diff --git a/src/containers/FilmFrontpage/MovieGrid.tsx b/src/containers/FilmFrontpage/MovieGrid.tsx
@@ -107,20 +107,23 @@ export const MovieGrid = ({ resourceType }: Props) => {
       ) : (
         <MovieListing>
           {resourceTypeMovies.data?.searchWithoutPagination?.results?.map((movie, index) => {
-            const context = movie.contexts.find((c) => c.contextType === "standard");
-            return (
-              <StyledFilmContentCard
-                style={{ "--index": index } as CSSProperties}
-                key={`${resourceType.id}-${index}`}
-                movie={{
-                  id: movie.id,
-                  metaImage: movie.metaImage,
-                  resourceTypes: [],
-                  title: movie.title,
-                  url: context?.url ?? "",
-                }}
-              />
-            );
+            if (movie.__typename === "ArticleSearchResult" || movie.__typename === "LearningpathSearchResult") {
+              const context = movie.contexts.find((c) => c.contextType === "standard");
+              return (
+                <StyledFilmContentCard
+                  style={{ "--index": index } as CSSProperties}
+                  key={`${resourceType.id}-${index}`}
+                  movie={{
+                    id: movie.id,
+                    metaImage: movie.metaImage,
+                    resourceTypes: [],
+                    title: movie.title,
+                    url: context?.url ?? "",
+                  }}
+                />
+              );
+            }
+            return null;
           })}
         </MovieListing>
       )}
@@ -169,8 +172,15 @@ const resourceTypeMoviesQuery = gql`
       results {
         id
         metaDescription
-        metaImage {
-          url
+        ... on ArticleSearchResult {
+          metaImage {
+            url
+          }
+        }
+        ... on LearningpathSearchResult {
+          metaImage {
+            url
+          }
         }
         title
         contexts {

diff --git a/src/containers/Masthead/components/MastheadSearch.tsx b/src/containers/Masthead/components/MastheadSearch.tsx
@@ -213,7 +213,10 @@ const MastheadSearch = () => {
         const contentType = contentTypeMapping?.[context?.resourceTypes?.[0]?.id ?? "default"];
         return {
           ...result,
-          id: result.id.toString(),
+          htmlTitle:
+            result.__typename === "ArticleSearchResult" || result.__typename === "LearningpathSearchResult"
+              ? parse(result.htmlTitle)
+              : result.title,
           resourceType: context?.resourceTypes?.[0]?.id,
           contentType,
           path: context?.url ?? result.url,
@@ -349,7 +352,7 @@ const MastheadSearch = () => {
                         <TextWrapper>
                           <ComboboxItemText>
                             <SafeLink to={resource.path} onClick={onNavigate} unstyled css={linkOverlay.raw()}>
-                              {parse(resource.htmlTitle)}
+                              {resource.htmlTitle}
                             </SafeLink>
                           </ComboboxItemText>
                           {!!resource.contexts[0] && (

diff --git a/src/containers/MyNdla/Learningpath/components/ResourcePicker.tsx b/src/containers/MyNdla/Learningpath/components/ResourcePicker.tsx
@@ -261,7 +261,12 @@ export const ResourcePicker = ({ setResource }: Props) => {
               <StyledComboboxItem key={collection.getItemValue(resource)} item={resource} className="peer" asChild>
                 <StyledListItemRoot context="list">
                   <StyledListItemContent>
-                    <ComboboxItemText>{parse(resource.htmlTitle)}</ComboboxItemText>
+                    <ComboboxItemText>
+                      {resource.__typename === "ArticleSearchResult" ||
+                      resource.__typename === "LearningpathSearchResult"
+                        ? parse(resource.htmlTitle)
+                        : resource.title}
+                    </ComboboxItemText>
                     {!!resource.contexts[0] && (
                       <Text
                         textStyle="label.small"

diff --git a/src/containers/TopicPage/MovedTopicPage.tsx b/src/containers/TopicPage/MovedTopicPage.tsx
@@ -14,10 +14,17 @@ import { HelmetWithTracker } from "@ndla/tracker";
 import { PageContainer } from "../../components/Layout/PageContainer";
 import { MovedNodeCard } from "../../components/MovedNodeCard";
 import { SKIP_TO_CONTENT_ID } from "../../constants";
-import { GQLMovedTopicPage_NodeFragment, GQLSearchResult } from "../../graphqlTypes";
+import {
+  GQLArticleSearchResult,
+  GQLLearningpathSearchResult,
+  GQLMovedTopicPage_NodeFragment,
+} from "../../graphqlTypes";
 
 interface GQLSearchResultExtended
-  extends Omit<GQLSearchResult, "id" | "contexts" | "metaDescription" | "supportedLanguages" | "traits"> {
+  extends Omit<
+    GQLLearningpathSearchResult | GQLArticleSearchResult,
+    "id" | "contexts" | "metaDescription" | "supportedLanguages" | "traits"
+  > {
   subjects?: {
     url?: string;
     title: string;