From ea1f9b4223baae32e6933c5bef0d8d3200fe4f2e Mon Sep 17 00:00:00 2001
From: fusagiko / takayamaki <24884114+takayamaki@users.noreply.github.com>
Date: Wed, 10 May 2023 06:08:28 +0900
Subject: [PATCH] [Glitch] Rename Image component to ServerHeroImage

Port ab7716cff4a1f590565b6a229282e899d7d02e96 to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>
---
 app/javascript/flavours/glitch/components/server_banner.jsx   | 4 ++--
 .../glitch/components/{image.tsx => server_hero_image.tsx}    | 2 +-
 app/javascript/flavours/glitch/features/about/index.jsx       | 4 ++--
 3 files changed, 5 insertions(+), 5 deletions(-)
 rename app/javascript/flavours/glitch/components/{image.tsx => server_hero_image.tsx} (93%)

diff --git a/app/javascript/flavours/glitch/components/server_banner.jsx b/app/javascript/flavours/glitch/components/server_banner.jsx
index 8b9c501538..ec264f1f1b 100644
--- a/app/javascript/flavours/glitch/components/server_banner.jsx
+++ b/app/javascript/flavours/glitch/components/server_banner.jsx
@@ -7,7 +7,7 @@ import ShortNumber from 'flavours/glitch/components/short_number';
 import Skeleton from 'flavours/glitch/components/skeleton';
 import Account from 'flavours/glitch/containers/account_container';
 import { domain } from 'flavours/glitch/initial_state';
-import { Image } from 'flavours/glitch/components/image';
+import { ServerHeroImage } from 'flavours/glitch/components/server_hero_image';
 import { Link } from 'react-router-dom';
 
 const messages = defineMessages({
@@ -41,7 +41,7 @@ class ServerBanner extends React.PureComponent {
           <FormattedMessage id='server_banner.introduction' defaultMessage='{domain} is part of the decentralized social network powered by {mastodon}.' values={{ domain: <strong>{domain}</strong>, mastodon: <a href='https://joinmastodon.org' target='_blank'>Mastodon</a> }} />
         </div>
 
-        <Image blurhash={server.getIn(['thumbnail', 'blurhash'])} src={server.getIn(['thumbnail', 'url'])} className='server-banner__hero' />
+        <ServerHeroImage blurhash={server.getIn(['thumbnail', 'blurhash'])} src={server.getIn(['thumbnail', 'url'])} className='server-banner__hero' />
 
         <div className='server-banner__description'>
           {isLoading ? (
diff --git a/app/javascript/flavours/glitch/components/image.tsx b/app/javascript/flavours/glitch/components/server_hero_image.tsx
similarity index 93%
rename from app/javascript/flavours/glitch/components/image.tsx
rename to app/javascript/flavours/glitch/components/server_hero_image.tsx
index 490543424a..d10b8a620b 100644
--- a/app/javascript/flavours/glitch/components/image.tsx
+++ b/app/javascript/flavours/glitch/components/server_hero_image.tsx
@@ -9,7 +9,7 @@ type Props = {
   className?: string;
 };
 
-export const Image: React.FC<Props> = ({
+export const ServerHeroImage: React.FC<Props> = ({
   src,
   srcSet,
   blurhash,
diff --git a/app/javascript/flavours/glitch/features/about/index.jsx b/app/javascript/flavours/glitch/features/about/index.jsx
index e2556ec340..8ef05d1f8a 100644
--- a/app/javascript/flavours/glitch/features/about/index.jsx
+++ b/app/javascript/flavours/glitch/features/about/index.jsx
@@ -11,7 +11,7 @@ import Account from 'flavours/glitch/containers/account_container';
 import Skeleton from 'flavours/glitch/components/skeleton';
 import { Icon } from 'flavours/glitch/components/icon';
 import classNames from 'classnames';
-import { Image } from 'flavours/glitch/components/image';
+import { ServerHeroImage } from 'flavours/glitch/components/server_hero_image';
 
 const messages = defineMessages({
   title: { id: 'column.about', defaultMessage: 'About' },
@@ -114,7 +114,7 @@ class About extends React.PureComponent {
       <Column bindToDocument={!multiColumn} label={intl.formatMessage(messages.title)}>
         <div className='scrollable about'>
           <div className='about__header'>
-            <Image blurhash={server.getIn(['thumbnail', 'blurhash'])} src={server.getIn(['thumbnail', 'url'])} srcSet={server.getIn(['thumbnail', 'versions'])?.map((value, key) => `${value} ${key.replace('@', '')}`).join(', ')} className='about__header__hero' />
+            <ServerHeroImage blurhash={server.getIn(['thumbnail', 'blurhash'])} src={server.getIn(['thumbnail', 'url'])} srcSet={server.getIn(['thumbnail', 'versions'])?.map((value, key) => `${value} ${key.replace('@', '')}`).join(', ')} className='about__header__hero' />
             <h1>{isLoading ? <Skeleton width='10ch' /> : server.get('domain')}</h1>
             <p><FormattedMessage id='about.powered_by' defaultMessage='Decentralized social media powered by {mastodon}' values={{ mastodon: <a href='https://joinmastodon.org' className='about__mail' target='_blank'>Mastodon</a> }} /></p>
           </div>