Integrated media content to all pages

This commit is contained in:
Umar Adilov 2025-05-14 20:04:24 +05:00
parent 4e54957a15
commit a2730f0b03
10 changed files with 38 additions and 25 deletions

View File

@ -12,6 +12,7 @@ import AnimatedCounter from '@/shared/components/animated-counter';
import { Container } from '@/shared/components/container';
import { Review } from '@/shared/components/review';
import { useTextController } from '@/shared/language/hooks/use-text-controller';
import { useMediaController } from '@/shared/media/hooks/use-media-controller';
import { Button } from '@/shared/shadcn-ui/button';
import { Card, CardContent } from '@/shared/shadcn-ui/card';
@ -25,6 +26,7 @@ export interface AboutPageProps {
export default function AboutPage({ content }: AboutPageProps) {
const { t } = useTextController();
const { m } = useMediaController();
return (
<div className='flex min-h-screen flex-col'>
@ -33,7 +35,10 @@ export default function AboutPage({ content }: AboutPageProps) {
<section className='relative'>
<div className='relative h-[400px] w-full overflow-hidden'>
<Image
src='/placeholder.svg?height=400&width=1920&text=Наша+История'
src={
m('about.hero-section.banner') ||
'/placeholder.svg?height=400&width=1920&text=Наша+История'
}
alt={t('about.hero.imageAlt')}
width={1920}
height={400}
@ -102,7 +107,10 @@ export default function AboutPage({ content }: AboutPageProps) {
className='relative h-[500px] overflow-hidden rounded-xl shadow-xl'
>
<Image
src='/placeholder.svg?height=500&width=600&text=Главный+офис'
src={
m('about.second-section.banner') ||
'/placeholder.svg?height=500&width=600&text=Главный+офис'
}
alt={t('about.overview.imageAlt')}
fill
className='object-cover'

View File

@ -4,6 +4,7 @@ import Image from 'next/image';
import { Container } from '@/shared/components/container';
import { useTextController } from '@/shared/language/hooks/use-text-controller';
import { useMediaController } from '@/shared/media/hooks/use-media-controller';
import { BenefitsSection } from '@/widgets/clients/ui/benefits-section';
import { ServicesOverviewSection } from '@/widgets/clients/ui/services-overview-section';
@ -11,6 +12,7 @@ import { CtaSection } from '@/widgets/cta-section';
export function ClientsPage() {
const { t } = useTextController();
const { m } = useMediaController();
return (
<div className='flex min-h-screen flex-col'>
@ -19,7 +21,10 @@ export function ClientsPage() {
<section className='relative'>
<div className='relative h-[400px] w-full overflow-hidden'>
<Image
src='/placeholder.svg?height=400&width=1920&text=Для+наших+клиентов'
src={
m('clients.hero-section.banner') ||
'/placeholder.svg?height=400&width=1920&text=Для+наших+клиентов'
}
alt='Для наших клиентов'
width={1920}
height={400}

View File

@ -16,8 +16,6 @@ export function LoyaltyPage() {
const { t } = useTextController();
const { m } = useMediaController();
const loyaltyProgrammMedia = m('page.loyaly.banner1');
return (
<div className='flex min-h-screen flex-col'>
<main className='flex-1'>
@ -25,7 +23,10 @@ export function LoyaltyPage() {
<section className='relative'>
<div className='relative h-[400px] w-full overflow-hidden'>
<Image
src='/placeholder.svg?height=400&width=1920&text=Программа+лояльности'
src={
m('loyalty.hero-section.banner') ||
'/placeholder.svg?height=400&width=1920&text=Программа+лояльности'
}
alt='Программа лояльности'
width={1920}
height={400}
@ -111,7 +112,7 @@ export function LoyaltyPage() {
className='relative h-[400px] overflow-hidden rounded-xl shadow-xl'
>
<Image
src={loyaltyProgrammMedia?.photo || ProgrammImg}
src={m('loyalty.second-section.banner') || ProgrammImg}
alt='Программа лояльности'
fill
className='w-full object-contain p-2.5'

View File

@ -7,12 +7,11 @@ import { useMediaController } from '../media/hooks/use-media-controller';
export const Logo = () => {
const { m } = useMediaController();
const logo = m('logo');
return (
<Link className='flex items-center gap-2' href={'/'}>
<Image
src={logo?.photo || '/logo-new.png'}
src={m('logo') || '/logo-new.png'}
alt='oriyo-logo'
width={110}
height={40}

View File

@ -7,7 +7,7 @@ import { MediaItem } from '@/shared/types/media.type';
export type MediaMap = Record<string, MediaItem>;
type MediaControlContextType = {
m: (key: string) => MediaItem | undefined;
m: (key: string) => string | null;
};
export const MediaControlContext = createContext<
@ -26,12 +26,12 @@ export function MediaControlProvider({
return pr;
}, {} as MediaMap);
const getMedia = (key: string): MediaItem | undefined => {
const getMedia = (key: string): string | null => {
if (mediaMap?.[key]) {
return mediaMap[key];
return mediaMap[key].photo;
}
console.warn(`Media key not found: ${key}`);
return undefined;
return null;
};
return (

View File

@ -6,9 +6,11 @@ import Image from 'next/image';
import AboutCounter from '@/shared/components/about-counter';
import { Container } from '@/shared/components/container';
import { useTextController } from '@/shared/language/hooks/use-text-controller';
import { useMediaController } from '@/shared/media/hooks/use-media-controller';
export const AboutSection = () => {
const { t } = useTextController();
const { m } = useMediaController();
return (
<section id='about'>
@ -37,7 +39,7 @@ export const AboutSection = () => {
data-aos='zoom-in-down'
>
<Image
src='/clients/loyatly/oriyo-price-board.png'
src={m('main.price-board') || ''}
alt='About our company'
fill
className='w-full object-contain p-2.5'

View File

@ -13,8 +13,6 @@ export const CharitySection = () => {
const { t } = useTextController();
const { m } = useMediaController();
const charityMedia = m('home.charity.banner');
return (
<section id='charity'>
<Container>
@ -25,7 +23,8 @@ export const CharitySection = () => {
>
<Image
src={
charityMedia?.photo || '/placeholder.svg?height=400&width=600'
m('home.charity.banner') ||
'/placeholder.svg?height=400&width=600'
}
alt='Charity Foundation'
fill

View File

@ -5,6 +5,7 @@ import Image from 'next/image';
import { Container } from '@/shared/components/container';
import { useTextController } from '@/shared/language/hooks/use-text-controller';
import { useMediaController } from '@/shared/media/hooks/use-media-controller';
interface Benefit {
title: string;
@ -32,6 +33,7 @@ const benefits: Array<Benefit> = [
export const BenefitsSection = () => {
const { t } = useTextController();
const { m } = useMediaController();
return (
<section className='bg-gray-50'>
@ -72,7 +74,10 @@ export const BenefitsSection = () => {
className='relative order-1 h-[400px] overflow-hidden rounded-xl shadow-xl md:order-2'
>
<Image
src='/placeholder.svg?height=400&width=600&text=Преимущества+для+клиентов'
src={
m('clients.third-section.banner') ||
'/placeholder.svg?height=400&width=600&text=Преимущества+для+клиентов'
}
alt='Преимущества для клиентов'
fill
className='object-cover'

View File

@ -12,8 +12,6 @@ export const HeroSection = () => {
const { t } = useTextController();
const { m } = useMediaController();
const banner = m('home.hero-section.banner');
return (
<section className='relative'>
<div className='relative h-[550px] w-full overflow-hidden bg-black sm:h-[500px] xl:h-[650px]'>
@ -28,7 +26,7 @@ export const HeroSection = () => {
className='sm:!-top-16 sm:-right-40 sm:!h-[70vh] sm:!w-[100vh] md:!-top-10 md:!-right-30 xl:!top-0 xl:!right-0'
>
<Image
src={banner?.photo || '/oriyo_bg.jpeg'}
src={m('home.hero-section.banner') || '/oriyo_bg.jpeg'}
alt='Oriyo Station'
fill
className='object-cover sm:scale-110 md:scale-120 xl:scale-140'

View File

@ -8,7 +8,6 @@ import { GasStationMap } from '@/features/map';
import { Container } from '@/shared/components/container';
import { useTextController } from '@/shared/language/hooks/use-text-controller';
import { useMediaController } from '@/shared/media/hooks/use-media-controller';
interface MapSectionProps {
stations: Stations;
@ -16,9 +15,6 @@ interface MapSectionProps {
export const MapSection = ({ stations }: MapSectionProps) => {
const { t } = useTextController();
const { m } = useMediaController();
const stationsMedia = m('stations.main');
return (
<section id='stations' className='bg-gray-50'>