diff --git a/app/stays/[stayId]/page.tsx b/app/stays/[stayId]/page.tsx index c8420f8..4b38592 100644 --- a/app/stays/[stayId]/page.tsx +++ b/app/stays/[stayId]/page.tsx @@ -1,4 +1,4 @@ -import { PageContainer, ShareButton, ImageContainer, BookingCalendar } from '@/components/common'; +import { PageContainer, ShareButton, ImageContainer, BookingCalendar, UserInfo } from '@/components/common'; import { FavoriteToggleButton, Rating } from '@/components/mainPages'; import { StayDetails } from '@/components/mainPages/staysPage'; import { Separator } from '@/components/ui/separator'; @@ -45,9 +45,14 @@ async function SingleStayPage({ params }: SingleStayPageProps) { beds, bedrooms, baths, - guests + guests, + profile } = stay; const details = { beds, bedrooms, baths, guests }; + const profileData = { + profileImage: profile.profileImage, + username: profile.displayName + }; const country = findCountryByCode(countryCode); @@ -72,10 +77,7 @@ async function SingleStayPage({ params }: SingleStayPageProps) {
-

- размещено - NikDoe -

+
diff --git a/components/common/UserInfo.tsx b/components/common/UserInfo.tsx new file mode 100644 index 0000000..846d23d --- /dev/null +++ b/components/common/UserInfo.tsx @@ -0,0 +1,35 @@ +import Image from 'next/image'; + +type UserInfoProps = { + profileData: { + profileImage: string; + username: string; + }; +}; + +function UserInfo({ profileData }: UserInfoProps) { + const { profileImage, username } = profileData; + + return ( +
+ {username} +
+

+ размещено + {username} +

+

+ 2 года назад +

+
+
+ ); +} + +export default UserInfo; diff --git a/components/common/index.ts b/components/common/index.ts index 06f1711..eff491a 100644 --- a/components/common/index.ts +++ b/components/common/index.ts @@ -2,4 +2,5 @@ export { default as BreadCrumbs } from './BreadCrumbs'; export { default as PageContainer } from './PageContainer'; export { default as ShareButton } from './ShareButton'; export { default as ImageContainer } from './ImageContainer'; -export { default as BookingCalendar } from './BookingCalendar'; \ No newline at end of file +export { default as BookingCalendar } from './BookingCalendar'; +export { default as UserInfo } from './UserInfo'; \ No newline at end of file diff --git a/components/form/CountriesInput.tsx b/components/form/CountriesInput.tsx index 067e9bc..6c84c03 100644 --- a/components/form/CountriesInput.tsx +++ b/components/form/CountriesInput.tsx @@ -1,7 +1,8 @@ 'use client'; import { Label } from '@/components/ui/label'; -import { formattedCountries, truncateCountryName } from '@/utils/countries'; +import { formattedCountries } from '@/utils/countries'; +import { formatText } from '@/utils/format'; import { Select, SelectContent, @@ -34,7 +35,7 @@ function CountriesInput({ placeholder }: { placeholder?: string }) { key={item.code} value={item.code} > - {truncateCountryName(item.name, COUNTRY_NAME_MAX_LENGTH)} + {formatText(item.name, COUNTRY_NAME_MAX_LENGTH)} ); })} diff --git a/components/mainPages/staysPage/StayCard.tsx b/components/mainPages/staysPage/StayCard.tsx index 3b3788b..f91c02e 100644 --- a/components/mainPages/staysPage/StayCard.tsx +++ b/components/mainPages/staysPage/StayCard.tsx @@ -1,11 +1,13 @@ -import { StayCardProps } from '@/utils/types'; import Link from 'next/link'; import Image from 'next/image'; -import { formatCurrency } from '@/utils/format'; import { Separator } from '@/components/ui/separator'; import StayCardAmenities from './StayCardAmenities'; import Rating from '../common/Rating'; +import { StayCardProps } from '@/utils/types'; +import { STAY_TITLE_MAX_LENGTH } from '@/utils/constants'; +import { formatCurrency, formatText } from '@/utils/format'; + type Props = { stay: StayCardProps; } @@ -28,7 +30,7 @@ function StayCard({ stay }: Props) {

- {stayTitle.substring(0, 25) + '...'} + {formatText(stayTitle, STAY_TITLE_MAX_LENGTH)}

diff --git a/utils/constants.ts b/utils/constants.ts index 3d73065..0633e31 100644 --- a/utils/constants.ts +++ b/utils/constants.ts @@ -9,6 +9,7 @@ export const TEXTAREA_DEFAULT_ROWS_NUMBER = 5; //CREATE STAY FORM export const COUNTRY_NAME_MAX_LENGTH = 34; +export const STAY_TITLE_MAX_LENGTH = 25; export const DEFAULT_ARRAY_LENGTH = 4; export const DEFAULT_STAY_PRICE = 100; export const COUNTRY_TRANSLATION_LANGUAGE = 'rus'; \ No newline at end of file diff --git a/utils/countries.ts b/utils/countries.ts index 8c778a3..5991d02 100644 --- a/utils/countries.ts +++ b/utils/countries.ts @@ -1,14 +1,6 @@ import countries from 'world-countries'; import { COUNTRY_TRANSLATION_LANGUAGE } from './constants'; -export function truncateCountryName(str: string, maxLength: number = 20): string { - if (str.length > maxLength) { - return str.slice(0, maxLength) + '...'; - } - - return str; -} - export const formattedCountries = countries.map((item) => ({ code: item.cca2, name: item.translations[COUNTRY_TRANSLATION_LANGUAGE].common, diff --git a/utils/format.ts b/utils/format.ts index 1670a6d..faabf88 100644 --- a/utils/format.ts +++ b/utils/format.ts @@ -7,3 +7,11 @@ export const formatCurrency = (amount: number | null) => { maximumFractionDigits: 0, }).format(value); }; + +export const formatText = (str: string, maxLength: number = 20): string => { + if (str.length > maxLength) { + return str.slice(0, maxLength) + '...'; + } + + return str; +};