Skip to content

Commit 154c680

Browse files
BorghildSelleBorghildSelle
committed
🎨 fix references
1 parent f175db3 commit 154c680

6 files changed

Lines changed: 156 additions & 141 deletions

File tree

‎web/core/Link/DownloadableLink.tsx‎

Lines changed: 5 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import { useTranslations } from 'next-intl'
12
import { forwardRef, useCallback, useState } from 'react'
23
//BsFiletypeDoc, BsFiletypeMov,
34
import {
@@ -8,7 +9,6 @@ import {
89
BsFiletypeXlsx,
910
BsFileZip,
1011
} from 'react-icons/bs'
11-
import { useIntl } from 'react-intl'
1212
import { Typography } from '@/core/Typography'
1313
import { twMerge } from '@/lib/twMerge/twMerge'
1414
import { Modal } from '@/sections/Modal'
@@ -52,7 +52,7 @@ const DownloadableLink = forwardRef<HTMLDivElement, DownloadableLinkProps>(
5252
const fileUrl = url
5353
? `${url.replace('cdn.sanity.io', 'cdn.equinor.com')}?${originalFilename.replace(/ /g, '-')}`
5454
: null
55-
const intl = useIntl()
55+
const intl = useTranslations()
5656
const [showModal, setShowModal] = useState(false)
5757
const [isFriendlyChallengeDone, setIsFriendlyChallengeDone] =
5858
useState(false)
@@ -209,18 +209,11 @@ const DownloadableLink = forwardRef<HTMLDivElement, DownloadableLinkProps>(
209209
title='Request file download'
210210
>
211211
<Typography as='h2' variant='h5' className='mb-4'>
212-
{intl.formatMessage({
213-
id: 'request_download_action_prefix',
214-
defaultMessage: 'Request',
215-
})}
212+
{intl('request_download_action_prefix')}
216213
{` ${assetLabel}`}
217214
</Typography>
218215
<Typography group='plain' variant='div' className='mb-10'>
219-
{intl.formatMessage({
220-
id: 'download_modal_ingress',
221-
defaultMessage:
222-
'Please confirm that you are human below and the link will appear.',
223-
})}
216+
{intl('download_modal_ingress')}
224217
</Typography>
225218
<FriendlyCaptcha
226219
startMode='auto'
@@ -239,11 +232,7 @@ const DownloadableLink = forwardRef<HTMLDivElement, DownloadableLinkProps>(
239232
role='alert'
240233
className='py-6 text-base text-slate-80'
241234
>
242-
{intl.formatMessage({
243-
id: 'not_human_message',
244-
defaultMessage:
245-
'We are sorry, but anti-robot protection failed and we cannot proceed',
246-
})}
235+
{intl('not_human_message')}
247236
</Typography>
248237
)}
249238
{isFriendlyChallengeDone && !notHuman && (

‎web/core/Link/FooterLink.tsx‎

Lines changed: 41 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -1,44 +1,52 @@
11
'use client'
2+
import { useTranslations } from 'next-intl'
23
import { forwardRef } from 'react'
3-
import { BaseLinkProps, BaseLink } from './BaseLink'
44
import { ArrowRight } from '../../icons'
5-
import { useTranslations } from 'next-intl'
5+
import { BaseLink, type BaseLinkProps } from './BaseLink'
66

77
export type FooterLinkProps = {
88
icon?: React.ReactNode
99
} & BaseLinkProps
1010

11-
const FooterLink = forwardRef<HTMLAnchorElement, FooterLinkProps>(function FooterLink(
12-
{ href = '', type = 'internalUrl', icon, children, ...rest },
13-
ref,
14-
) {
15-
const isExternal = type === 'externalUrl' || href.startsWith('http') || href.toLowerCase().includes('.pdf')
16-
const target = isExternal ? '_blank' : undefined
17-
const intl = useTranslations()
11+
const FooterLink = forwardRef<HTMLAnchorElement, FooterLinkProps>(
12+
function FooterLink(
13+
{ href = '', type = 'internalUrl', icon, children, ...rest },
14+
ref,
15+
) {
16+
const isExternal =
17+
type === 'externalUrl' ||
18+
href.startsWith('http') ||
19+
href.toLowerCase().includes('.pdf')
20+
const target = isExternal ? '_blank' : undefined
21+
const intl = useTranslations()
1822

19-
return (
20-
<BaseLink
21-
ref={ref}
22-
href={href}
23-
target={target}
24-
type={type}
25-
{...rest}
26-
className={`group flex min-h-11 min-w-11 items-center gap-1 text-sm text-white-100 no-underline hover:text-moss-green-90 hover:underline dark:hover:text-moss-green-90`}
27-
>
28-
{icon && (
29-
<span className="mr-1.5 size-6 fill-white-100 leading-none group-hover:fill-moss-green-90" aria-hidden={true}>
30-
{icon}
31-
</span>
32-
)}
33-
<span className="flex leading-none">{children}</span>
34-
{isExternal && (
35-
<ArrowRight
36-
aria-label={`${intl('externalLink')} arrow right icon`}
37-
className="size-5 -translate-y-0.5 rotate-[-50deg] transform text-gray-500 group-hover:text-moss-green-90"
38-
/>
39-
)}
40-
</BaseLink>
41-
)
42-
})
23+
return (
24+
<BaseLink
25+
ref={ref}
26+
href={href}
27+
target={target}
28+
type={type}
29+
{...rest}
30+
className={`group flex min-h-11 min-w-11 items-center gap-1 text-sm text-white-100 no-underline hover:text-moss-green-90 hover:underline dark:hover:text-moss-green-90`}
31+
>
32+
{icon && (
33+
<span
34+
className='mr-1.5 size-6 fill-white-100 leading-none group-hover:fill-moss-green-90'
35+
aria-hidden={true}
36+
>
37+
{icon}
38+
</span>
39+
)}
40+
<span className='flex leading-none'>{children}</span>
41+
{isExternal && (
42+
<ArrowRight
43+
aria-label={`${intl('externalLink')} arrow right icon`}
44+
className='-translate-y-0.5 size-5 rotate-[-50deg] transform text-gray-500 group-hover:text-moss-green-90'
45+
/>
46+
)}
47+
</BaseLink>
48+
)
49+
},
50+
)
4351

4452
export default FooterLink

‎web/pageComponents/search/UniversalHit.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import type { Hit as AlgoliaHit } from '@algolia/client-search'
22
import { useLocale } from 'next-intl'
33
import FormattedDateTime from '@/core/FormattedDateTime/FormattedDateTime'
4-
import { BaseLink } from '@/core/Link'
4+
import { BaseLink } from '@/core/Link/BaseLink'
55
import { Typography } from '@/core/Typography'
66
import { defaultLanguage } from '@/languageConfig'
77
import { host } from '@/lib/config'

‎web/templates/newsroom/NewsSections/NewsHeadliner.tsx‎

Lines changed: 77 additions & 70 deletions
Original file line numberDiff line numberDiff line change
@@ -1,82 +1,89 @@
1-
import { forwardRef, HTMLAttributes } from 'react'
2-
import { BaseLink } from '@/core/Link'
1+
import type { SanityImageObject } from '@sanity/image-url'
2+
import NextImage from 'next/image'
3+
import { forwardRef, type HTMLAttributes } from 'react'
4+
import { twMerge } from 'tailwind-merge'
5+
import FormattedDateTime from '@/core/FormattedDateTime/FormattedDateTime'
6+
import { BaseLink } from '@/core/Link/BaseLink'
37
import { Typography } from '@/core/Typography'
48
import { getSmallerThanPxLgSizes, Image } from '../../../core/Image/Image'
5-
import NextImage from 'next/image'
6-
import { NewsRoomNewsItem } from '../../../types/algoliaIndexPage'
7-
import { SanityImageObject } from '@sanity/image-url/lib/types/types'
89
import Blocks from '../../../portableText/Blocks'
9-
import FormattedDateTime from '@/core/FormattedDateTime/FormattedDateTime'
10-
import { twMerge } from 'tailwind-merge'
10+
import type { NewsRoomNewsItem } from '../../../types/algoliaIndexPage'
1111

1212
export type NewsHeadlinerProps = {
1313
data: NewsRoomNewsItem
1414
fallbackImage?: SanityImageObject
1515
} & HTMLAttributes<HTMLLIElement>
1616

17-
const NewsHeadliner = forwardRef<HTMLLIElement, NewsHeadlinerProps>(function NewsHeadliner(
18-
{ data, fallbackImage, className = '', ...rest },
19-
ref,
20-
) {
21-
const { slug, title, ingress, publishDateTime, heroImage, thumbnailUrl } = data
17+
const NewsHeadliner = forwardRef<HTMLLIElement, NewsHeadlinerProps>(
18+
function NewsHeadliner(
19+
{ data, fallbackImage, className = '', ...rest },
20+
ref,
21+
) {
22+
const { slug, title, ingress, publishDateTime, heroImage, thumbnailUrl } =
23+
data
2224

23-
return (
24-
<section ref={ref} {...rest} className={twMerge('', className)}>
25-
<BaseLink href={slug} className="group flex flex-col gap-2 pb-6">
26-
{(heroImage?.image?.asset || fallbackImage || thumbnailUrl) && (
27-
<div className="relative mb-2 aspect-video max-h-[324px]">
28-
{thumbnailUrl ? (
29-
<NextImage
30-
className="relative h-full w-full rounded-2xs object-cover"
31-
src={thumbnailUrl}
32-
alt=""
33-
sizes={getSmallerThanPxLgSizes()}
34-
role={'presentation'}
35-
/>
36-
) : (
37-
(heroImage?.image?.asset || fallbackImage) && (
38-
<Image
39-
//@ts-ignore: TODO Fix SanityImage to take SanityImageObject
40-
image={heroImage?.image?.asset ? heroImage?.image : fallbackImage}
41-
aria-hidden
42-
grid="sm"
43-
fill
44-
className="rounded-2xs"
25+
return (
26+
<section ref={ref} {...rest} className={twMerge('', className)}>
27+
<BaseLink href={slug} className='group flex flex-col gap-2 pb-6'>
28+
{(heroImage?.image?.asset || fallbackImage || thumbnailUrl) && (
29+
<div className='relative mb-2 aspect-video max-h-[324px]'>
30+
{thumbnailUrl ? (
31+
<NextImage
32+
className='relative h-full w-full rounded-2xs object-cover'
33+
src={thumbnailUrl}
34+
alt=''
35+
sizes={getSmallerThanPxLgSizes()}
36+
role={'presentation'}
4537
/>
46-
)
47-
)}
48-
</div>
49-
)}
50-
{publishDateTime && (
51-
<div>
52-
<FormattedDateTime
53-
variant="date"
54-
datetime={publishDateTime}
55-
uppercase
56-
className="text-2xs leading-normal font-normal"
57-
/>
58-
<span className="mx-2 pb-1 text-2xs leading-normal font-normal">|</span>
59-
<FormattedDateTime
60-
variant="time"
61-
datetime={publishDateTime}
62-
className="pb-1 text-2xs leading-normal font-normal"
63-
/>
64-
</div>
65-
)}
66-
{title && (
67-
<Typography as="h2" variant="md" className="group-hover:underline">
68-
{title}
69-
</Typography>
70-
)}
71-
{Array.isArray(ingress) ? (
72-
<Blocks value={ingress} className="max-w-prose text-sm" />
73-
) : (
74-
<Typography variant="body" className="max-w-prose` text-sm">
75-
{ingress}
76-
</Typography>
77-
)}
78-
</BaseLink>
79-
</section>
80-
)
81-
})
38+
) : (
39+
(heroImage?.image?.asset || fallbackImage) && (
40+
<Image
41+
//@ts-ignore: TODO Fix SanityImage to take SanityImageObject
42+
image={
43+
heroImage?.image?.asset ? heroImage?.image : fallbackImage
44+
}
45+
aria-hidden
46+
grid='sm'
47+
fill
48+
className='rounded-2xs'
49+
/>
50+
)
51+
)}
52+
</div>
53+
)}
54+
{publishDateTime && (
55+
<div>
56+
<FormattedDateTime
57+
variant='date'
58+
datetime={publishDateTime}
59+
uppercase
60+
className='font-normal text-2xs leading-normal'
61+
/>
62+
<span className='mx-2 pb-1 font-normal text-2xs leading-normal'>
63+
|
64+
</span>
65+
<FormattedDateTime
66+
variant='time'
67+
datetime={publishDateTime}
68+
className='pb-1 font-normal text-2xs leading-normal'
69+
/>
70+
</div>
71+
)}
72+
{title && (
73+
<Typography as='h2' variant='md' className='group-hover:underline'>
74+
{title}
75+
</Typography>
76+
)}
77+
{Array.isArray(ingress) ? (
78+
<Blocks value={ingress} className='max-w-prose text-sm' />
79+
) : (
80+
<Typography variant='body' className='max-w-prose` text-sm'>
81+
{ingress}
82+
</Typography>
83+
)}
84+
</BaseLink>
85+
</section>
86+
)
87+
},
88+
)
8289
export default NewsHeadliner

0 commit comments

Comments
 (0)