Resolve DEICH-5544 / Aktørsøk

Det gjenstår noen avklaringer, spesielt hva angår tittel på resultatbolkene. Derfor avventer jeg å gjøre noe med getSearchQuerySegments som nå ligger både i SearchResults og AgentSearchResults, men jeg mistenker at den må gjøres en del med. Den vil antagelig også brukes til å parse spørringen, det gjenstår en TODO der i search/index.js:

const agentSearchQuery = searchQuery.replace("aktør:", "") // TODO proper parsing

deichman.no/components/AgentCard/AgentCard.js

+import React from "react";
+import PropTypes from "prop-types";
+import { Block } from "@digibib/deichman-ui";
+import Link from "next/link";
+
+import { slugifyAndEncode } from "../../utilities/slug";
+import { getRandomColorClass } from "../../server/utils/colours";
+
+import "./styles.css";
+
+const agentTypeLabel = (agent) => {
+  let label = agent.type.toUpperCase(); // PERSON | KORPORASJON
+  if (agent.birthYear && agent.deathYear) {
+    label = `${label} (${agent.birthYear}-${agent.deathYear})`;
+  } else if (agent.birthYear) {
+    label = `${label} (f. ${agent.birthYear})`;
+  } else if (agent.deathYear) {
+    label = `${label} (d. ${agent.deathYear})`;
+  }
+  return label;
+}
+
+
+const AgentCard = ({ agent }) => {
+  const linkHref = `/${agent.type}/${agent.type}Slug`;
+  const linkAs = `/${agent.type}/${slugifyAndEncode(agent.name)}_${agent.id}`
+
+  return (
+    <Link href={linkHref} as={linkAs}>
+      <a>
+        <article className="agent-card">
+          <Block className={`agent-card__image ${getRandomColorClass(agent.uri)}`}>
+            <div className="agent-card__image-inner" style={{ backgroundImage: `url("/static/icons/placeholders/person.svg")` }} />
+          </Block>
+          <Block className="agent-card__details">
+            <Block>
+              <p className="agent-card__label">{agentTypeLabel(agent)}</p>
+            </Block>
+            <Block className="agent-card__title" data-cy="card-title">
+              <h3 className="h4">{agent.name}</h3>
+            </Block>
+            <Block className="agent-card__roles">
+              {agent.roles.join(", ")}
+            </Block>
+          </Block>
+        </article>
+      </a>
+    </Link>
+  );
+};
+
+AgentCard.propTypes = {
+  agent: PropTypes.object.isRequired,
+};
+
+export default AgentCard;