Enhance Internet Offering Components and Improve User Guidance
- Updated InternetImportantNotes component for better clarity and user understanding. - Simplified InternetOfferingCard layout by removing unused props, enhancing usability. - Improved PlanComparisonGuide with collapsible sections for easier navigation. - Enhanced PublicOfferingCard to support custom call-to-action labels and click handlers. - Updated SimTypeSelector with additional EID information and verification notices for improved user guidance. - Refined PublicInternetPlans and PublicSimPlans views to highlight new services and enhance overall presentation.
This commit is contained in:
barsa
parent
3bb4e8ce40
commit
d313ba0c2c
11
apps/portal/src/app/(public)/(site)/about/page.tsx
Normal file
11
apps/portal/src/app/(public)/(site)/about/page.tsx
Normal file
@ -0,0 +1,11 @@
|
|||||||
|
/**
|
||||||
|
* Public About Page
|
||||||
|
*
|
||||||
|
* Corporate profile and company information.
|
||||||
|
*/
|
||||||
|
|
||||||
|
import { AboutUsView } from "@/features/marketing/views/AboutUsView";
|
||||||
|
|
||||||
|
export default function AboutPage() {
|
||||||
|
return <AboutUsView />;
|
||||||
|
}
|
||||||
@ -0,0 +1,97 @@
|
|||||||
|
import { Button } from "@/components/atoms";
|
||||||
|
import {
|
||||||
|
ServerStackIcon,
|
||||||
|
ComputerDesktopIcon,
|
||||||
|
WrenchScrewdriverIcon,
|
||||||
|
GlobeAltIcon,
|
||||||
|
} from "@heroicons/react/24/outline";
|
||||||
|
|
||||||
|
export default function BusinessSolutionsPage() {
|
||||||
|
return (
|
||||||
|
<div className="max-w-6xl mx-auto px-4">
|
||||||
|
{/* Header */}
|
||||||
|
<div className="text-center mb-16 pt-8">
|
||||||
|
<h1 className="text-4xl sm:text-5xl font-extrabold text-foreground mb-6 tracking-tight">
|
||||||
|
Business Solutions
|
||||||
|
</h1>
|
||||||
|
<p className="text-xl text-muted-foreground max-w-2xl mx-auto leading-relaxed">
|
||||||
|
We provide comprehensive business solutions including DIA (Dedicated Internet Access) with
|
||||||
|
SLA and bandwidth guarantees to ensure your business stays connected.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="grid grid-cols-1 md:grid-cols-2 gap-8 mb-16">
|
||||||
|
{/* Office LAN Setup */}
|
||||||
|
<div className="bg-card rounded-2xl border border-border/60 p-8 shadow-sm">
|
||||||
|
<div className="h-12 w-12 rounded-xl bg-primary/10 flex items-center justify-center text-primary mb-6">
|
||||||
|
<ComputerDesktopIcon className="h-6 w-6" />
|
||||||
|
</div>
|
||||||
|
<h2 className="text-2xl font-bold text-foreground mb-4">Office LAN Setup</h2>
|
||||||
|
<p className="text-muted-foreground leading-relaxed mb-6">
|
||||||
|
Whether you are upgrading your current LAN for greater bandwidth and reliability or
|
||||||
|
installing a new LAN for a new facility, Assist Solutions will ensure you make informed
|
||||||
|
decisions. From cable installation and data switches to configuration of routers and
|
||||||
|
firewalls, we help you determine a cost-effective and reliable way to do this.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Onsite & Remote Tech Support */}
|
||||||
|
<div className="bg-card rounded-2xl border border-border/60 p-8 shadow-sm">
|
||||||
|
<div className="h-12 w-12 rounded-xl bg-primary/10 flex items-center justify-center text-primary mb-6">
|
||||||
|
<WrenchScrewdriverIcon className="h-6 w-6" />
|
||||||
|
</div>
|
||||||
|
<h2 className="text-2xl font-bold text-foreground mb-4">Onsite & Remote Tech Support</h2>
|
||||||
|
<p className="text-muted-foreground leading-relaxed mb-6">
|
||||||
|
We provide onsite and remote support to make sure your network is up and running as
|
||||||
|
quickly as possible. Assist Solutions can help with your IT needs so you can grow your
|
||||||
|
business with ease and stability. From computer networks to phone and printer
|
||||||
|
installations, our team will complete your project to your highest satisfaction.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Dedicated Internet Access (DIA) */}
|
||||||
|
<div className="bg-card rounded-2xl border border-border/60 p-8 shadow-sm">
|
||||||
|
<div className="h-12 w-12 rounded-xl bg-primary/10 flex items-center justify-center text-primary mb-6">
|
||||||
|
<GlobeAltIcon className="h-6 w-6" />
|
||||||
|
</div>
|
||||||
|
<h2 className="text-2xl font-bold text-foreground mb-4">
|
||||||
|
Dedicated Internet Access (DIA)
|
||||||
|
</h2>
|
||||||
|
<p className="text-muted-foreground leading-relaxed mb-6">
|
||||||
|
Dedicated Internet Access is designed for businesses that need greater Internet capacity
|
||||||
|
and a dedicated connection between their existing Local Area Network (LAN) and the
|
||||||
|
public Internet. We are able to provide a bandwidth guarantee with a service level
|
||||||
|
agreement depending on what is most suitable for your business.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Data Center Service */}
|
||||||
|
<div className="bg-card rounded-2xl border border-border/60 p-8 shadow-sm">
|
||||||
|
<div className="h-12 w-12 rounded-xl bg-primary/10 flex items-center justify-center text-primary mb-6">
|
||||||
|
<ServerStackIcon className="h-6 w-6" />
|
||||||
|
</div>
|
||||||
|
<h2 className="text-2xl font-bold text-foreground mb-4">Data Center Service</h2>
|
||||||
|
<p className="text-muted-foreground leading-relaxed mb-6">
|
||||||
|
Our Data Center Service provides high-quality data center facilities in Equinix (Tokyo
|
||||||
|
Tennozu Isle) and GDC (Gotenyama) and many value-added network services to help
|
||||||
|
establish stable infrastructure platforms. This improves both reliability and efficiency
|
||||||
|
in your company.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* CTA */}
|
||||||
|
<div className="text-center py-12 bg-muted/20 rounded-3xl mb-16">
|
||||||
|
<h2 className="text-2xl font-bold text-foreground mb-4">
|
||||||
|
Interested in our Business Solutions?
|
||||||
|
</h2>
|
||||||
|
<p className="text-muted-foreground mb-8 max-w-2xl mx-auto">
|
||||||
|
Contact us today to discuss your requirements and how we can help your business grow.
|
||||||
|
</p>
|
||||||
|
<Button as="a" href="/contact" size="lg">
|
||||||
|
Contact Us
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
@ -0,0 +1,17 @@
|
|||||||
|
/**
|
||||||
|
* Public Internet Configure Page
|
||||||
|
*
|
||||||
|
* Configure internet plan for unauthenticated users.
|
||||||
|
*/
|
||||||
|
|
||||||
|
import { PublicInternetConfigureView } from "@/features/catalog/views/PublicInternetConfigure";
|
||||||
|
import { RedirectAuthenticatedToAccountServices } from "@/features/catalog/components/common/RedirectAuthenticatedToAccountServices";
|
||||||
|
|
||||||
|
export default function PublicInternetConfigurePage() {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<RedirectAuthenticatedToAccountServices targetPath="/account/services/internet/configure" />
|
||||||
|
<PublicInternetConfigureView />
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
@ -0,0 +1,17 @@
|
|||||||
|
/**
|
||||||
|
* Public Internet Plans Page
|
||||||
|
*
|
||||||
|
* Displays internet plans for unauthenticated users.
|
||||||
|
*/
|
||||||
|
|
||||||
|
import { PublicInternetPlansView } from "@/features/catalog/views/PublicInternetPlans";
|
||||||
|
import { RedirectAuthenticatedToAccountServices } from "@/features/catalog/components/common/RedirectAuthenticatedToAccountServices";
|
||||||
|
|
||||||
|
export default function PublicInternetPlansPage() {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<RedirectAuthenticatedToAccountServices targetPath="/account/services/internet" />
|
||||||
|
<PublicInternetPlansView />
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
147
apps/portal/src/app/(public)/(site)/services/onsite/page.tsx
Normal file
147
apps/portal/src/app/(public)/(site)/services/onsite/page.tsx
Normal file
@ -0,0 +1,147 @@
|
|||||||
|
import { Button } from "@/components/atoms";
|
||||||
|
import {
|
||||||
|
UserGroupIcon,
|
||||||
|
ComputerDesktopIcon,
|
||||||
|
TvIcon,
|
||||||
|
ChatBubbleLeftRightIcon,
|
||||||
|
} from "@heroicons/react/24/outline";
|
||||||
|
|
||||||
|
export default function OnsiteSupportPage() {
|
||||||
|
return (
|
||||||
|
<div className="max-w-6xl mx-auto px-4">
|
||||||
|
{/* Header */}
|
||||||
|
<div className="text-center mb-16 pt-8">
|
||||||
|
<h1 className="text-4xl sm:text-5xl font-extrabold text-foreground mb-6 tracking-tight">
|
||||||
|
Onsite Support
|
||||||
|
</h1>
|
||||||
|
<p className="text-xl text-muted-foreground max-w-2xl mx-auto leading-relaxed">
|
||||||
|
We dispatch our skillful in-house tech staff to your residence or office for your needs.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Main Services */}
|
||||||
|
<div className="grid grid-cols-1 md:grid-cols-2 gap-12 mb-20">
|
||||||
|
<div className="space-y-6">
|
||||||
|
<h2 className="text-3xl font-bold text-foreground">Need Our Technical Support?</h2>
|
||||||
|
<p className="text-muted-foreground leading-relaxed">
|
||||||
|
We can provide you with on-site technical support service. If you would like for our
|
||||||
|
technicians to visit your residence and provide technical assistance, please let us
|
||||||
|
know.
|
||||||
|
</p>
|
||||||
|
<p className="text-muted-foreground leading-relaxed">
|
||||||
|
We also provide "Remote Access Services" which allows our technicians to do support via
|
||||||
|
Remote Access Software over the Internet connection to fix up the issue (depends on what
|
||||||
|
the issue is).
|
||||||
|
</p>
|
||||||
|
<div className="pt-4">
|
||||||
|
<Button as="a" href="/contact" size="lg">
|
||||||
|
Request Support
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="relative h-[300px] bg-muted/30 rounded-2xl overflow-hidden flex items-center justify-center">
|
||||||
|
<UserGroupIcon className="h-32 w-32 text-muted-foreground/20" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Pricing Cards */}
|
||||||
|
<div className="grid grid-cols-1 md:grid-cols-3 gap-6 mb-20">
|
||||||
|
{/* Onsite Network & Computer Support */}
|
||||||
|
<div className="bg-card rounded-2xl border border-border/60 p-6 shadow-sm flex flex-col">
|
||||||
|
<div className="h-12 w-12 rounded-xl bg-primary/10 flex items-center justify-center text-primary mb-4">
|
||||||
|
<ComputerDesktopIcon className="h-6 w-6" />
|
||||||
|
</div>
|
||||||
|
<h3 className="text-lg font-bold text-foreground mb-2">
|
||||||
|
Onsite Network & Computer Support
|
||||||
|
</h3>
|
||||||
|
<div className="mt-auto pt-4">
|
||||||
|
<div className="text-sm text-muted-foreground mb-1">Basic Service Fee</div>
|
||||||
|
<div className="text-3xl font-bold text-foreground">15,000 JPY</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Remote Support */}
|
||||||
|
<div className="bg-card rounded-2xl border border-border/60 p-6 shadow-sm flex flex-col">
|
||||||
|
<div className="h-12 w-12 rounded-xl bg-primary/10 flex items-center justify-center text-primary mb-4">
|
||||||
|
<ChatBubbleLeftRightIcon className="h-6 w-6" />
|
||||||
|
</div>
|
||||||
|
<h3 className="text-lg font-bold text-foreground mb-2">
|
||||||
|
Remote Network & Computer Support
|
||||||
|
</h3>
|
||||||
|
<div className="mt-auto pt-4">
|
||||||
|
<div className="text-sm text-muted-foreground mb-1">Basic Service Fee</div>
|
||||||
|
<div className="text-3xl font-bold text-foreground">5,000 JPY</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Onsite TV Support */}
|
||||||
|
<div className="bg-card rounded-2xl border border-border/60 p-6 shadow-sm flex flex-col">
|
||||||
|
<div className="h-12 w-12 rounded-xl bg-primary/10 flex items-center justify-center text-primary mb-4">
|
||||||
|
<TvIcon className="h-6 w-6" />
|
||||||
|
</div>
|
||||||
|
<h3 className="text-lg font-bold text-foreground mb-2">Onsite TV Support Service</h3>
|
||||||
|
<div className="mt-auto pt-4">
|
||||||
|
<div className="text-sm text-muted-foreground mb-1">Basic Service Fee</div>
|
||||||
|
<div className="text-3xl font-bold text-foreground">15,000 JPY</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* FAQ Section */}
|
||||||
|
<div className="max-w-4xl mx-auto mb-16">
|
||||||
|
<h2 className="text-3xl font-bold text-foreground mb-8 text-center">
|
||||||
|
Frequently Asked Questions
|
||||||
|
</h2>
|
||||||
|
|
||||||
|
<div className="space-y-8">
|
||||||
|
<div className="bg-card rounded-2xl border border-border/60 p-8">
|
||||||
|
<h3 className="text-xl font-bold text-foreground mb-3">
|
||||||
|
My home requires multiple Wi-Fi routers. Would you be able to assist with this?
|
||||||
|
</h3>
|
||||||
|
<p className="text-muted-foreground leading-relaxed">
|
||||||
|
Yes, the Assist Solutions technical team is able to visit your residence for device
|
||||||
|
set up including Wi-Fi routers, printers, Apple TVs etc. Our tech consulting team will
|
||||||
|
be able to make suggestions based on your residence layout and requirements. Please
|
||||||
|
contact us for a free consultation.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="bg-card rounded-2xl border border-border/60 p-8">
|
||||||
|
<h3 className="text-xl font-bold text-foreground mb-3">
|
||||||
|
I am already subscribed to a different Internet provider but require more Wi-Fi
|
||||||
|
coverage. Would I be able to just opt for the Onsite Support service without switching
|
||||||
|
over my entire home Internet service?
|
||||||
|
</h3>
|
||||||
|
<p className="text-muted-foreground leading-relaxed">
|
||||||
|
Yes, we are able to offer the Onsite Support service as a standalone service.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="bg-card rounded-2xl border border-border/60 p-8">
|
||||||
|
<h3 className="text-xl font-bold text-foreground mb-3">
|
||||||
|
Do you offer this service outside of Tokyo?
|
||||||
|
</h3>
|
||||||
|
<div className="text-muted-foreground leading-relaxed">
|
||||||
|
<p className="mb-2">
|
||||||
|
Our In-Home Technical Assistance service can be provided in Tokyo, Saitama and
|
||||||
|
Kanagawa prefecture.
|
||||||
|
</p>
|
||||||
|
<p className="text-sm italic">
|
||||||
|
*Please note that this service may not available in some areas within the above
|
||||||
|
prefectures. For more information, please contact us.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* CTA */}
|
||||||
|
<div className="text-center py-12 bg-muted/20 rounded-3xl">
|
||||||
|
<h2 className="text-2xl font-bold text-foreground mb-4">Ready to get started?</h2>
|
||||||
|
<Button as="a" href="/contact" size="lg">
|
||||||
|
Contact Us for Support
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
149
apps/portal/src/app/(public)/(site)/services/page.tsx
Normal file
149
apps/portal/src/app/(public)/(site)/services/page.tsx
Normal file
@ -0,0 +1,149 @@
|
|||||||
|
import Link from "next/link";
|
||||||
|
import {
|
||||||
|
BuildingOfficeIcon,
|
||||||
|
WrenchScrewdriverIcon,
|
||||||
|
TvIcon,
|
||||||
|
ArrowRightIcon,
|
||||||
|
ServerIcon,
|
||||||
|
DevicePhoneMobileIcon,
|
||||||
|
ShieldCheckIcon,
|
||||||
|
} from "@heroicons/react/24/outline";
|
||||||
|
|
||||||
|
export default function ServicesPage() {
|
||||||
|
return (
|
||||||
|
<div className="max-w-6xl mx-auto px-4">
|
||||||
|
{/* Header */}
|
||||||
|
<div className="text-center mb-16 pt-8">
|
||||||
|
<h1 className="text-4xl sm:text-5xl font-extrabold text-foreground mb-6 tracking-tight">
|
||||||
|
Our Services
|
||||||
|
</h1>
|
||||||
|
<p className="text-xl text-muted-foreground max-w-2xl mx-auto leading-relaxed">
|
||||||
|
From high-speed internet to onsite support, we provide comprehensive solutions for your
|
||||||
|
home and business.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="grid grid-cols-1 md:grid-cols-3 gap-8 mb-20">
|
||||||
|
{/* Internet */}
|
||||||
|
<Link href="/services/internet" className="group block h-full">
|
||||||
|
<div className="h-full bg-card rounded-2xl border border-border/60 p-8 shadow-sm transition-all duration-300 hover:shadow-md hover:border-blue-500/50 flex flex-col">
|
||||||
|
<div className="h-14 w-14 rounded-2xl bg-blue-500/10 flex items-center justify-center text-blue-600 mb-6 group-hover:scale-110 transition-transform">
|
||||||
|
<ServerIcon className="h-7 w-7" />
|
||||||
|
</div>
|
||||||
|
<h2 className="text-2xl font-bold text-foreground mb-3 group-hover:text-blue-600 transition-colors">
|
||||||
|
Internet
|
||||||
|
</h2>
|
||||||
|
<p className="text-muted-foreground mb-6 flex-grow">
|
||||||
|
NTT fiber with speeds up to 10Gbps and professional installation support. Fast and
|
||||||
|
reliable connectivity.
|
||||||
|
</p>
|
||||||
|
<div className="flex items-center text-blue-600 font-medium mt-auto">
|
||||||
|
View Plans{" "}
|
||||||
|
<ArrowRightIcon className="h-4 w-4 ml-2 group-hover:translate-x-1 transition-transform" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</Link>
|
||||||
|
|
||||||
|
{/* SIM & eSIM */}
|
||||||
|
<Link href="/services/sim" className="group block h-full">
|
||||||
|
<div className="h-full bg-card rounded-2xl border border-border/60 p-8 shadow-sm transition-all duration-300 hover:shadow-md hover:border-green-500/50 flex flex-col">
|
||||||
|
<div className="h-14 w-14 rounded-2xl bg-green-500/10 flex items-center justify-center text-green-600 mb-6 group-hover:scale-110 transition-transform">
|
||||||
|
<DevicePhoneMobileIcon className="h-7 w-7" />
|
||||||
|
</div>
|
||||||
|
<h2 className="text-2xl font-bold text-foreground mb-3 group-hover:text-green-600 transition-colors">
|
||||||
|
SIM & eSIM
|
||||||
|
</h2>
|
||||||
|
<p className="text-muted-foreground mb-6 flex-grow">
|
||||||
|
Data, voice & SMS on NTT Docomo's nationwide network. Available as physical SIM or
|
||||||
|
instant eSIM.
|
||||||
|
</p>
|
||||||
|
<div className="flex items-center text-green-600 font-medium mt-auto">
|
||||||
|
View Plans{" "}
|
||||||
|
<ArrowRightIcon className="h-4 w-4 ml-2 group-hover:translate-x-1 transition-transform" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</Link>
|
||||||
|
|
||||||
|
{/* VPN */}
|
||||||
|
<Link href="/services/vpn" className="group block h-full">
|
||||||
|
<div className="h-full bg-card rounded-2xl border border-border/60 p-8 shadow-sm transition-all duration-300 hover:shadow-md hover:border-purple-500/50 flex flex-col">
|
||||||
|
<div className="h-14 w-14 rounded-2xl bg-purple-500/10 flex items-center justify-center text-purple-600 mb-6 group-hover:scale-110 transition-transform">
|
||||||
|
<ShieldCheckIcon className="h-7 w-7" />
|
||||||
|
</div>
|
||||||
|
<h2 className="text-2xl font-bold text-foreground mb-3 group-hover:text-purple-600 transition-colors">
|
||||||
|
VPN
|
||||||
|
</h2>
|
||||||
|
<p className="text-muted-foreground mb-6 flex-grow">
|
||||||
|
Access US/UK content with a pre-configured router. Easy plug & play setup for seamless
|
||||||
|
streaming.
|
||||||
|
</p>
|
||||||
|
<div className="flex items-center text-purple-600 font-medium mt-auto">
|
||||||
|
View Plans{" "}
|
||||||
|
<ArrowRightIcon className="h-4 w-4 ml-2 group-hover:translate-x-1 transition-transform" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</Link>
|
||||||
|
|
||||||
|
{/* Business Solutions */}
|
||||||
|
<Link href="/services/business" className="group block h-full">
|
||||||
|
<div className="h-full bg-card rounded-2xl border border-border/60 p-8 shadow-sm transition-all duration-300 hover:shadow-md hover:border-primary/50 flex flex-col">
|
||||||
|
<div className="h-14 w-14 rounded-2xl bg-primary/10 flex items-center justify-center text-primary mb-6 group-hover:scale-110 transition-transform">
|
||||||
|
<BuildingOfficeIcon className="h-7 w-7" />
|
||||||
|
</div>
|
||||||
|
<h2 className="text-2xl font-bold text-foreground mb-3 group-hover:text-primary transition-colors">
|
||||||
|
Business Solutions
|
||||||
|
</h2>
|
||||||
|
<p className="text-muted-foreground mb-6 flex-grow">
|
||||||
|
Dedicated Internet Access (DIA), Office LAN setup, Data Center services, and
|
||||||
|
onsite/remote tech support.
|
||||||
|
</p>
|
||||||
|
<div className="flex items-center text-primary font-medium mt-auto">
|
||||||
|
Learn more{" "}
|
||||||
|
<ArrowRightIcon className="h-4 w-4 ml-2 group-hover:translate-x-1 transition-transform" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</Link>
|
||||||
|
|
||||||
|
{/* Onsite Support */}
|
||||||
|
<Link href="/services/onsite" className="group block h-full">
|
||||||
|
<div className="h-full bg-card rounded-2xl border border-border/60 p-8 shadow-sm transition-all duration-300 hover:shadow-md hover:border-primary/50 flex flex-col">
|
||||||
|
<div className="h-14 w-14 rounded-2xl bg-primary/10 flex items-center justify-center text-primary mb-6 group-hover:scale-110 transition-transform">
|
||||||
|
<WrenchScrewdriverIcon className="h-7 w-7" />
|
||||||
|
</div>
|
||||||
|
<h2 className="text-2xl font-bold text-foreground mb-3 group-hover:text-primary transition-colors">
|
||||||
|
Onsite Support
|
||||||
|
</h2>
|
||||||
|
<p className="text-muted-foreground mb-6 flex-grow">
|
||||||
|
Professional technical support at your residence or office. Network setup, device
|
||||||
|
configuration, and troubleshooting.
|
||||||
|
</p>
|
||||||
|
<div className="flex items-center text-primary font-medium mt-auto">
|
||||||
|
Learn more{" "}
|
||||||
|
<ArrowRightIcon className="h-4 w-4 ml-2 group-hover:translate-x-1 transition-transform" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</Link>
|
||||||
|
|
||||||
|
{/* TV Services */}
|
||||||
|
<Link href="/services/tv" className="group block h-full">
|
||||||
|
<div className="h-full bg-card rounded-2xl border border-border/60 p-8 shadow-sm transition-all duration-300 hover:shadow-md hover:border-primary/50 flex flex-col">
|
||||||
|
<div className="h-14 w-14 rounded-2xl bg-primary/10 flex items-center justify-center text-primary mb-6 group-hover:scale-110 transition-transform">
|
||||||
|
<TvIcon className="h-7 w-7" />
|
||||||
|
</div>
|
||||||
|
<h2 className="text-2xl font-bold text-foreground mb-3 group-hover:text-primary transition-colors">
|
||||||
|
TV Services
|
||||||
|
</h2>
|
||||||
|
<p className="text-muted-foreground mb-6 flex-grow">
|
||||||
|
Satellite, Cable, and Optical Fiber TV services. We arrange subscriptions for major
|
||||||
|
Japanese TV providers.
|
||||||
|
</p>
|
||||||
|
<div className="flex items-center text-primary font-medium mt-auto">
|
||||||
|
Learn more{" "}
|
||||||
|
<ArrowRightIcon className="h-4 w-4 ml-2 group-hover:translate-x-1 transition-transform" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</Link>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
@ -0,0 +1,17 @@
|
|||||||
|
/**
|
||||||
|
* Public SIM Configure Page
|
||||||
|
*
|
||||||
|
* Configure SIM plan for unauthenticated users.
|
||||||
|
*/
|
||||||
|
|
||||||
|
import { PublicSimConfigureView } from "@/features/catalog/views/PublicSimConfigure";
|
||||||
|
import { RedirectAuthenticatedToAccountServices } from "@/features/catalog/components/common/RedirectAuthenticatedToAccountServices";
|
||||||
|
|
||||||
|
export default function PublicSimConfigurePage() {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<RedirectAuthenticatedToAccountServices targetPath="/account/services/sim/configure" />
|
||||||
|
<PublicSimConfigureView />
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
17
apps/portal/src/app/(public)/(site)/services/sim/page.tsx
Normal file
17
apps/portal/src/app/(public)/(site)/services/sim/page.tsx
Normal file
@ -0,0 +1,17 @@
|
|||||||
|
/**
|
||||||
|
* Public SIM Plans Page
|
||||||
|
*
|
||||||
|
* Displays SIM plans for unauthenticated users.
|
||||||
|
*/
|
||||||
|
|
||||||
|
import { PublicSimPlansView } from "@/features/catalog/views/PublicSimPlans";
|
||||||
|
import { RedirectAuthenticatedToAccountServices } from "@/features/catalog/components/common/RedirectAuthenticatedToAccountServices";
|
||||||
|
|
||||||
|
export default function PublicSimPlansPage() {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<RedirectAuthenticatedToAccountServices targetPath="/account/services/sim" />
|
||||||
|
<PublicSimPlansView />
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
729
apps/portal/src/app/(public)/(site)/services/tv/page.tsx
Normal file
729
apps/portal/src/app/(public)/(site)/services/tv/page.tsx
Normal file
@ -0,0 +1,729 @@
|
|||||||
|
import { Button } from "@/components/atoms";
|
||||||
|
import {
|
||||||
|
TvIcon,
|
||||||
|
FilmIcon,
|
||||||
|
MusicalNoteIcon,
|
||||||
|
TrophyIcon,
|
||||||
|
NewspaperIcon,
|
||||||
|
SparklesIcon,
|
||||||
|
EllipsisHorizontalCircleIcon,
|
||||||
|
AcademicCapIcon,
|
||||||
|
GlobeAsiaAustraliaIcon,
|
||||||
|
} from "@heroicons/react/24/outline";
|
||||||
|
|
||||||
|
export default function TVServicesPage() {
|
||||||
|
return (
|
||||||
|
<div className="max-w-6xl mx-auto px-4">
|
||||||
|
{/* Header */}
|
||||||
|
<div className="text-center mb-16 pt-8">
|
||||||
|
<h1 className="text-4xl sm:text-5xl font-extrabold text-foreground mb-6 tracking-tight">
|
||||||
|
TV Services
|
||||||
|
</h1>
|
||||||
|
<p className="text-xl text-muted-foreground max-w-2xl mx-auto leading-relaxed">
|
||||||
|
Providing a variety of options for our customers such as Satellite TV, Cable TV and
|
||||||
|
Optical Fiber TV.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Intro */}
|
||||||
|
<div className="max-w-3xl mx-auto text-center mb-16">
|
||||||
|
<h2 className="text-2xl font-bold text-foreground mb-4">Service Lineup</h2>
|
||||||
|
<p className="text-muted-foreground leading-relaxed mb-6">
|
||||||
|
We are proud to act as agents for Japan's major paid TV service providers, and we will
|
||||||
|
arrange your services on your behalf (no service fee required for us to arrange your
|
||||||
|
services). Usually each building has their pre-assigned main TV service providers. To find
|
||||||
|
out which TV service you can apply for, please feel free to contact us anytime.
|
||||||
|
</p>
|
||||||
|
<Button as="a" href="/contact" size="lg">
|
||||||
|
Check Availability
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Services List */}
|
||||||
|
<div className="space-y-16 mb-20">
|
||||||
|
{/* Sky PerfecTV Premium Hikari */}
|
||||||
|
<TVServiceSection
|
||||||
|
title="Sky PerfecTV Premium Hikari (Optical Fiber TV)"
|
||||||
|
fees={[
|
||||||
|
{ type: "Apartment Type", initial: "Free", monthly: "4,567 JPY" },
|
||||||
|
{
|
||||||
|
type: "Home Type",
|
||||||
|
initial: "14,630 JPY (6,680 JPY if simultaneous installation)",
|
||||||
|
monthly: "5,392 JPY",
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
note="*Prices shown above are including tax (10%)"
|
||||||
|
>
|
||||||
|
<ChannelPackage title="Basic Package">
|
||||||
|
<ChannelCategory
|
||||||
|
title="Movie"
|
||||||
|
channels={[
|
||||||
|
"The Cinema HD",
|
||||||
|
"Movie Plus HD",
|
||||||
|
"Channel NECO HD",
|
||||||
|
"Japanese Movie HD",
|
||||||
|
"Fox Movie Premium HD",
|
||||||
|
"Cinefil Wowow HD",
|
||||||
|
"NTV G HD",
|
||||||
|
"EX Sports",
|
||||||
|
"Dance Channel",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="Sports"
|
||||||
|
channels={[
|
||||||
|
"Golf Network HD",
|
||||||
|
"GAORA HD",
|
||||||
|
"J Sports 1 HD",
|
||||||
|
"J Sports 2 HD",
|
||||||
|
"J Sports 3 HD",
|
||||||
|
"Sky A Sports HD",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="Music"
|
||||||
|
channels={[
|
||||||
|
"Music Japan TV HD",
|
||||||
|
"MTV HD",
|
||||||
|
"Music ON! TV HD",
|
||||||
|
"Space Shower TV HD",
|
||||||
|
"Space Shower TV Plus HD",
|
||||||
|
"Kayou Pops HD",
|
||||||
|
"Music Air HD",
|
||||||
|
"Music Graffiti TV",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="Kids"
|
||||||
|
channels={[
|
||||||
|
"Cartoon Network HD",
|
||||||
|
"Disney Channel HD",
|
||||||
|
"Disney XD HD",
|
||||||
|
"Kids Station HD",
|
||||||
|
"Animax HD",
|
||||||
|
"Lala HD",
|
||||||
|
"Asia Dramatic TV HD",
|
||||||
|
"KBS World HD",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="Foreign Drama"
|
||||||
|
channels={[
|
||||||
|
"Super Drama TV HD",
|
||||||
|
"AXN Mystery HD",
|
||||||
|
"AXN HD",
|
||||||
|
"FOX HD",
|
||||||
|
"FOX CLASSICS HD",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="Documentary"
|
||||||
|
channels={[
|
||||||
|
"History Channel HD",
|
||||||
|
"National Geographic HD",
|
||||||
|
"Discovery HD",
|
||||||
|
"Nat Geo Wild HD",
|
||||||
|
"Animal Planet HD",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="News & Business"
|
||||||
|
channels={[
|
||||||
|
"TBS News Bird HD",
|
||||||
|
"Nikkei CNBC HD",
|
||||||
|
"BBC World News HD",
|
||||||
|
"CNNj HD",
|
||||||
|
"NTV News 24",
|
||||||
|
"SORA Weather Channel",
|
||||||
|
"E-tenki.net",
|
||||||
|
"Entametele HD",
|
||||||
|
"Nittele Plus HD",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="Entertainment"
|
||||||
|
channels={[
|
||||||
|
"Fox Sports HD",
|
||||||
|
"FujiTV One HD",
|
||||||
|
"FujiTV Two HD",
|
||||||
|
"TBS Channel 1 HD",
|
||||||
|
"TBS Channel 2 HD",
|
||||||
|
"TV Asahi Channel 1 HD",
|
||||||
|
"TV Asahi Channel 2 HD",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="Others"
|
||||||
|
channels={[
|
||||||
|
"Mondo TV HD",
|
||||||
|
"Family Theater HD",
|
||||||
|
"Home Drama HD",
|
||||||
|
"Samurai Drama HD",
|
||||||
|
"TABI Channel HD",
|
||||||
|
"Tsuri Vision HD",
|
||||||
|
"Igo/Shogi Channel HD",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
</ChannelPackage>
|
||||||
|
</TVServiceSection>
|
||||||
|
|
||||||
|
{/* Sky PerfecTV Premium (Satellite) */}
|
||||||
|
<TVServiceSection
|
||||||
|
title="Sky PerfecTV Premium (Satellite)"
|
||||||
|
fees={[{ type: "Standard", initial: "Free", monthly: "4,514 JPY" }]}
|
||||||
|
note="*Prices shown above are including tax (10%)"
|
||||||
|
>
|
||||||
|
<ChannelPackage title="Basic Package">
|
||||||
|
<ChannelCategory
|
||||||
|
title="Movie"
|
||||||
|
channels={[
|
||||||
|
"Imagica BS HD",
|
||||||
|
"The Cinema HD",
|
||||||
|
"Movie Plus HD",
|
||||||
|
"Channel NECO HD",
|
||||||
|
"Japanese Movie HD",
|
||||||
|
"Fox Movie Premium HD",
|
||||||
|
"Cinefil Wowow HD",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="Sports"
|
||||||
|
channels={[
|
||||||
|
"J Sports 3 HD",
|
||||||
|
"Sky A Sports HD",
|
||||||
|
"NTV G HD",
|
||||||
|
"EX Sports",
|
||||||
|
"Dance Channel",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="Music"
|
||||||
|
channels={[
|
||||||
|
"Music Japan TV HD",
|
||||||
|
"MTV HD",
|
||||||
|
"Music ON! TV HD",
|
||||||
|
"Space Shower TV HD",
|
||||||
|
"Space Shower TV Plus HD",
|
||||||
|
"Kayou Pops HD",
|
||||||
|
"Music Air HD",
|
||||||
|
"Music Graffiti TV",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="Kids"
|
||||||
|
channels={[
|
||||||
|
"Cartoon Network HD",
|
||||||
|
"Disney Channel HD",
|
||||||
|
"Disney XD HD",
|
||||||
|
"Kids Station HD",
|
||||||
|
"Animax HD",
|
||||||
|
"Disney Junior",
|
||||||
|
"Asia Dramatic TV HD",
|
||||||
|
"KBS World HD",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="Foreign Drama"
|
||||||
|
channels={[
|
||||||
|
"Super Drama TV HD",
|
||||||
|
"AXN Mystery HD",
|
||||||
|
"AXN HD",
|
||||||
|
"FOX HD",
|
||||||
|
"FOX CLASSICS HD",
|
||||||
|
"Lala HD",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="Documentary"
|
||||||
|
channels={[
|
||||||
|
"History Channel HD",
|
||||||
|
"National Geographic HD",
|
||||||
|
"Discovery HD",
|
||||||
|
"Nat Geo Wild HD",
|
||||||
|
"Animal Planet HD",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="News & Business"
|
||||||
|
channels={[
|
||||||
|
"TBS News Bird HD",
|
||||||
|
"Nikkei CNBC HD",
|
||||||
|
"BBC World News HD",
|
||||||
|
"CNNj HD",
|
||||||
|
"NTV News 24",
|
||||||
|
"CCTV Daifu",
|
||||||
|
"SORA Weather Channel",
|
||||||
|
"Entametele HD",
|
||||||
|
"NTV Plus HD",
|
||||||
|
"Channel Ginga",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="Entertainment"
|
||||||
|
channels={[
|
||||||
|
"Fox Sports HD",
|
||||||
|
"FujiTV One HD",
|
||||||
|
"FujiTV Two HD",
|
||||||
|
"TBS Channel 1 HD",
|
||||||
|
"TBS Channel 2 HD",
|
||||||
|
"TV Asahi Channel 1 HD",
|
||||||
|
"TV Asahi Channel 2 HD",
|
||||||
|
"Yose Channel",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="Others"
|
||||||
|
channels={[
|
||||||
|
"IGO & Shogi",
|
||||||
|
"Mondo 21 HD",
|
||||||
|
"Family Theater HD",
|
||||||
|
"Home Drama HD",
|
||||||
|
"Samurai Drama HD",
|
||||||
|
"TABI Channel HD",
|
||||||
|
"Railyway Channel HD",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
</ChannelPackage>
|
||||||
|
</TVServiceSection>
|
||||||
|
|
||||||
|
{/* Sky PerfecTV (Satellite) */}
|
||||||
|
<TVServiceSection
|
||||||
|
title="Sky PerfecTV (Satellite)"
|
||||||
|
fees={[
|
||||||
|
{ type: "Apartment Type", initial: "Free", monthly: "4,389 JPY" },
|
||||||
|
{
|
||||||
|
type: "Home Type",
|
||||||
|
initial: "11,330 JPY (6,680 JPY if simultaneous installation)",
|
||||||
|
monthly: "5,214 JPY",
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
note="*Prices shown above are including tax (10%)"
|
||||||
|
>
|
||||||
|
<ChannelPackage title="Basic Package">
|
||||||
|
<ChannelCategory
|
||||||
|
title="Movie"
|
||||||
|
channels={[
|
||||||
|
"Movie Plus HD",
|
||||||
|
"Japanese Movie HD (BS)",
|
||||||
|
"The Cinema",
|
||||||
|
"Channel NECO",
|
||||||
|
"Cinefil Wowow HD",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="Sports"
|
||||||
|
channels={["Nittele G HD", "Sky A Sports HD", "GAORA Sports HD", "Fox Sports HD"]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="Music"
|
||||||
|
channels={[
|
||||||
|
"MTV HD",
|
||||||
|
"Music ON! TV HD",
|
||||||
|
"Space Shower TV",
|
||||||
|
"Music Air",
|
||||||
|
"Space Shower TV Plus",
|
||||||
|
"Kayo Pops",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="Kids"
|
||||||
|
channels={[
|
||||||
|
"Kids Station HD",
|
||||||
|
"BS Animax HD (BS)",
|
||||||
|
"Disney (BS)",
|
||||||
|
"Cartoon Network",
|
||||||
|
"Disney Junior",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="Foreign Drama"
|
||||||
|
channels={["Lala HD", "Super Drama TV HD", "AXN", "AXN Mystery", "FOX"]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="Documentary"
|
||||||
|
channels={["History Channel", "National Geographic", "Discovery", "Animal Planet"]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="News & Business"
|
||||||
|
channels={[
|
||||||
|
"TBS News Bird",
|
||||||
|
"BBC World News",
|
||||||
|
"CNNj",
|
||||||
|
"NTV News 24",
|
||||||
|
"TBS Channel 1 HD",
|
||||||
|
"TBS Channel 2",
|
||||||
|
"NTV Plus",
|
||||||
|
"Channel Ginga",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="Entertainment"
|
||||||
|
channels={[
|
||||||
|
"Fuji TV One HD",
|
||||||
|
"Fuji TV Two HD",
|
||||||
|
"TV Asahi Channel 1 HD",
|
||||||
|
"TV Asahi Channel 2 HD",
|
||||||
|
"Igo/Shogi Channel",
|
||||||
|
"Mondo TV HD",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="Others"
|
||||||
|
channels={[
|
||||||
|
"Tsuri Vision HD (BS)",
|
||||||
|
"Family Gekijo HD",
|
||||||
|
"Samurai Drama HD",
|
||||||
|
"Home Drama Channel",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
</ChannelPackage>
|
||||||
|
</TVServiceSection>
|
||||||
|
|
||||||
|
{/* iTSCOM (CATV) */}
|
||||||
|
<TVServiceSection
|
||||||
|
title="iTSCOM (CATV)"
|
||||||
|
fees={[{ type: "Big Package", initial: "11,000 JPY", monthly: "5,280 JPY" }]}
|
||||||
|
note="*Prices shown above are including tax (10%)"
|
||||||
|
>
|
||||||
|
<ChannelPackage title="Big Package">
|
||||||
|
<ChannelCategory
|
||||||
|
title="Movie"
|
||||||
|
channels={[
|
||||||
|
"Movie Plus HD",
|
||||||
|
"Japanese Movie HD",
|
||||||
|
"Channel NECO HD",
|
||||||
|
"FOX Movie Premium HD",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="Sports"
|
||||||
|
channels={[
|
||||||
|
"Golf Network HD",
|
||||||
|
"Nittele G HD",
|
||||||
|
"Sky A Sports HD",
|
||||||
|
"GAORA HD",
|
||||||
|
"J Sports 1 HD",
|
||||||
|
"J Sports 2 HD",
|
||||||
|
"J Sports 3 HD",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="Music"
|
||||||
|
channels={["MTV HD", "Music ON! TV HD", "Space Shower TV", "Music Air"]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="Kids"
|
||||||
|
channels={[
|
||||||
|
"Animax HD",
|
||||||
|
"Kids Station HD",
|
||||||
|
"Disney XD",
|
||||||
|
"Cartoon Network",
|
||||||
|
"Baby TV",
|
||||||
|
"Disney Junior",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="Foreign Drama"
|
||||||
|
channels={[
|
||||||
|
"AXN HD",
|
||||||
|
"FOX HD",
|
||||||
|
"Asia Dramatic TV HD",
|
||||||
|
"Super Drama TV HD",
|
||||||
|
"AXN Mystery HD",
|
||||||
|
"Family Theater HD",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="Documentary"
|
||||||
|
channels={[
|
||||||
|
"Discovery HD",
|
||||||
|
"National Geographic",
|
||||||
|
"Animal Planet HD",
|
||||||
|
"History Channel HD",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="News & Business"
|
||||||
|
channels={[
|
||||||
|
"BBC World News HD",
|
||||||
|
"CNNj HD",
|
||||||
|
"Nikkei CNBC HD",
|
||||||
|
"TBS News Bird HD",
|
||||||
|
"TV Asahi Channel 2",
|
||||||
|
"NTV News 24",
|
||||||
|
"NHK World Japan",
|
||||||
|
"Disney Channel HD",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="Entertainment"
|
||||||
|
channels={[
|
||||||
|
"LaLa TV HD",
|
||||||
|
"Channel Ginga HD",
|
||||||
|
"Dlife HD",
|
||||||
|
"FOX Sports HD",
|
||||||
|
"TBS Channel 1 HD",
|
||||||
|
"TBS Channel 2",
|
||||||
|
"NTV Plus",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="Others"
|
||||||
|
channels={[
|
||||||
|
"Japanet Channel DX HD",
|
||||||
|
"Jewelly Gem Shopping HD",
|
||||||
|
"Samurai Drama HD",
|
||||||
|
"TABI Channel",
|
||||||
|
"QVC",
|
||||||
|
"Shop Channel",
|
||||||
|
"Igo/Shogi Channel",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
</ChannelPackage>
|
||||||
|
</TVServiceSection>
|
||||||
|
|
||||||
|
{/* JCOM (CATV) */}
|
||||||
|
<TVServiceSection
|
||||||
|
title="JCOM (CATV)"
|
||||||
|
fees={[{ type: "Standard Package", initial: "9,900 JPY", monthly: "6,074 JPY" }]}
|
||||||
|
note="*Prices shown above are including tax (10%)"
|
||||||
|
>
|
||||||
|
<ChannelPackage title="Standard Package">
|
||||||
|
<ChannelCategory
|
||||||
|
title="Movie"
|
||||||
|
channels={[
|
||||||
|
"Movie Plus HD",
|
||||||
|
"The Cinema HD",
|
||||||
|
"Channel NECO HD",
|
||||||
|
"Japanese Movie HD",
|
||||||
|
"Fox Movies",
|
||||||
|
"Cinefil Wowow HD",
|
||||||
|
"Fox Sports & Entertainment",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="Sports"
|
||||||
|
channels={[
|
||||||
|
"J Sports 1 HD",
|
||||||
|
"J Sports 2 HD",
|
||||||
|
"J Sports 3 HD",
|
||||||
|
"Sky A Sports HD",
|
||||||
|
"Golf Network HD",
|
||||||
|
"GAORA HD",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="Music"
|
||||||
|
channels={["MTV HD", "Music ON! TV HD", "Space Shower TV", "Kayou Pops"]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="Kids"
|
||||||
|
channels={[
|
||||||
|
"Animax HD",
|
||||||
|
"Kids Station HD",
|
||||||
|
"Cartoon Network HD",
|
||||||
|
"Disney CHannel HD",
|
||||||
|
"Disney XD HD",
|
||||||
|
"Disney Junior HD",
|
||||||
|
"AXN Mystery HD",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="Foreign Drama"
|
||||||
|
channels={[
|
||||||
|
"Super Drama TV HD",
|
||||||
|
"FOX HD",
|
||||||
|
"FOX Classics HD",
|
||||||
|
"AXN HD",
|
||||||
|
"Lala HD",
|
||||||
|
"KBS World HD",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="Documentary"
|
||||||
|
channels={[
|
||||||
|
"Histroy Channel HD",
|
||||||
|
"National Geographic HD",
|
||||||
|
"Discovery Channel HD",
|
||||||
|
"Animal Planet HD",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="News & Business"
|
||||||
|
channels={[
|
||||||
|
"TBS News Bird HD",
|
||||||
|
"Nikkei CNBC HD",
|
||||||
|
"TV Asahi Channel 2 HD",
|
||||||
|
"CNNj",
|
||||||
|
"NTV News 24",
|
||||||
|
"NHK World Japan",
|
||||||
|
"KBS World",
|
||||||
|
"NTV Plus",
|
||||||
|
"Act On TV",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="Entertainment"
|
||||||
|
channels={[
|
||||||
|
"FujiTV One HD",
|
||||||
|
"FujiTV Two HD",
|
||||||
|
"TBS Channel 1 HD",
|
||||||
|
"TBS Channel 2 HD",
|
||||||
|
"Channel Ginga HD",
|
||||||
|
"TV Asahi Channel 1",
|
||||||
|
"Housou University TV",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
<ChannelCategory
|
||||||
|
title="Others"
|
||||||
|
channels={[
|
||||||
|
"Family Theater HD",
|
||||||
|
"Samurai Drama HD",
|
||||||
|
"Home Drama Channel HD",
|
||||||
|
"Mondo TV HD",
|
||||||
|
"Tsuri Vision HD",
|
||||||
|
"Igo/Shogi Channel",
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
</ChannelPackage>
|
||||||
|
</TVServiceSection>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* FAQ */}
|
||||||
|
<div className="max-w-4xl mx-auto mb-16">
|
||||||
|
<h2 className="text-3xl font-bold text-foreground mb-8 text-center">
|
||||||
|
Frequently Asked Questions
|
||||||
|
</h2>
|
||||||
|
<div className="space-y-6">
|
||||||
|
<div className="bg-card rounded-2xl border border-border/60 p-8">
|
||||||
|
<h3 className="text-xl font-bold text-foreground mb-3">
|
||||||
|
Is Assist Solutions directly providing the TV service?
|
||||||
|
</h3>
|
||||||
|
<p className="text-muted-foreground leading-relaxed">
|
||||||
|
As partners, we are able to refer you to each cable TV company available at your home.
|
||||||
|
However, once the service starts, the cable TV service itself will be directly
|
||||||
|
provided by each cable TV company.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="bg-card rounded-2xl border border-border/60 p-8">
|
||||||
|
<h3 className="text-xl font-bold text-foreground mb-3">
|
||||||
|
Would I be able to choose any cable TV service that Assist Solutions is partnered
|
||||||
|
with?
|
||||||
|
</h3>
|
||||||
|
<p className="text-muted-foreground leading-relaxed">
|
||||||
|
In Japan, most cable TV companies have predetermined service areas. We will be able to
|
||||||
|
check which services are available for your home. Please contact us for a free
|
||||||
|
consultation.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* CTA */}
|
||||||
|
<div className="text-center py-12 bg-muted/20 rounded-3xl">
|
||||||
|
<h2 className="text-2xl font-bold text-foreground mb-4">
|
||||||
|
Find the best TV service for you
|
||||||
|
</h2>
|
||||||
|
<Button as="a" href="/contact" size="lg">
|
||||||
|
Contact Us
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Helper Components
|
||||||
|
|
||||||
|
function TVServiceSection({
|
||||||
|
title,
|
||||||
|
fees,
|
||||||
|
note,
|
||||||
|
children,
|
||||||
|
}: {
|
||||||
|
title: string;
|
||||||
|
fees: { type: string; initial: string; monthly: string }[];
|
||||||
|
note?: string;
|
||||||
|
children?: React.ReactNode;
|
||||||
|
}) {
|
||||||
|
return (
|
||||||
|
<div className="border border-border/60 rounded-2xl overflow-hidden bg-card shadow-sm">
|
||||||
|
<div className="bg-primary/5 p-6 border-b border-border/60">
|
||||||
|
<div className="flex items-center gap-3">
|
||||||
|
<div className="h-10 w-10 rounded-lg bg-primary/10 flex items-center justify-center text-primary">
|
||||||
|
<TvIcon className="h-6 w-6" />
|
||||||
|
</div>
|
||||||
|
<h2 className="text-2xl font-bold text-foreground">{title}</h2>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="p-6 md:p-8">
|
||||||
|
<div className="mb-8">
|
||||||
|
<h3 className="text-sm font-semibold text-muted-foreground uppercase tracking-wider mb-4">
|
||||||
|
Service Fees
|
||||||
|
</h3>
|
||||||
|
<div className="overflow-x-auto">
|
||||||
|
<table className="w-full text-sm text-left">
|
||||||
|
<thead className="bg-muted/50 text-muted-foreground font-medium">
|
||||||
|
<tr>
|
||||||
|
<th className="px-4 py-3 rounded-l-lg">Type</th>
|
||||||
|
<th className="px-4 py-3">Initial Cost</th>
|
||||||
|
<th className="px-4 py-3 rounded-r-lg">Monthly Cost</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody className="divide-y divide-border/60">
|
||||||
|
{fees.map((fee, i) => (
|
||||||
|
<tr key={i}>
|
||||||
|
<td className="px-4 py-3 font-medium text-foreground">{fee.type}</td>
|
||||||
|
<td className="px-4 py-3">{fee.initial}</td>
|
||||||
|
<td className="px-4 py-3">{fee.monthly}</td>
|
||||||
|
</tr>
|
||||||
|
))}
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
{note && <p className="text-xs text-muted-foreground mt-2">{note}</p>}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{children}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
function ChannelPackage({ title, children }: { title: string; children: React.ReactNode }) {
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<h3 className="text-lg font-bold text-foreground mb-4 border-l-4 border-primary pl-3">
|
||||||
|
{title}
|
||||||
|
</h3>
|
||||||
|
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">{children}</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
function ChannelCategory({ title, channels }: { title: string; channels: string[] }) {
|
||||||
|
return (
|
||||||
|
<div className="bg-muted/30 rounded-lg p-4">
|
||||||
|
<h4 className="font-semibold text-foreground mb-3 flex items-center gap-2">
|
||||||
|
{title === "Movie" && <FilmIcon className="h-4 w-4 text-primary" />}
|
||||||
|
{title === "Music" && <MusicalNoteIcon className="h-4 w-4 text-primary" />}
|
||||||
|
{title === "Sports" && <TrophyIcon className="h-4 w-4 text-primary" />}
|
||||||
|
{title === "News & Business" && <NewspaperIcon className="h-4 w-4 text-primary" />}
|
||||||
|
{title === "Entertainment" && <SparklesIcon className="h-4 w-4 text-primary" />}
|
||||||
|
{title === "Kids" && <SparklesIcon className="h-4 w-4 text-primary" />}
|
||||||
|
{title === "Foreign Drama" && <GlobeAsiaAustraliaIcon className="h-4 w-4 text-primary" />}
|
||||||
|
{title === "Documentary" && <AcademicCapIcon className="h-4 w-4 text-primary" />}
|
||||||
|
{title === "Others" && <EllipsisHorizontalCircleIcon className="h-4 w-4 text-primary" />}
|
||||||
|
{title}
|
||||||
|
</h4>
|
||||||
|
<ul className="space-y-1">
|
||||||
|
{channels.map(channel => (
|
||||||
|
<li key={channel} className="text-sm text-muted-foreground">
|
||||||
|
{channel}
|
||||||
|
</li>
|
||||||
|
))}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
17
apps/portal/src/app/(public)/(site)/services/vpn/page.tsx
Normal file
17
apps/portal/src/app/(public)/(site)/services/vpn/page.tsx
Normal file
@ -0,0 +1,17 @@
|
|||||||
|
/**
|
||||||
|
* Public VPN Plans Page
|
||||||
|
*
|
||||||
|
* Displays VPN plans for unauthenticated users.
|
||||||
|
*/
|
||||||
|
|
||||||
|
import { PublicVpnPlansView } from "@/features/catalog/views/PublicVpnPlans";
|
||||||
|
import { RedirectAuthenticatedToAccountServices } from "@/features/catalog/components/common/RedirectAuthenticatedToAccountServices";
|
||||||
|
|
||||||
|
export default function PublicVpnPlansPage() {
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<RedirectAuthenticatedToAccountServices targetPath="/account/services/vpn" />
|
||||||
|
<PublicVpnPlansView />
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
@ -0,0 +1,5 @@
|
|||||||
|
import InternetCancelContainer from "@/features/subscriptions/views/InternetCancel";
|
||||||
|
|
||||||
|
export default function AccountInternetCancelPage() {
|
||||||
|
return <InternetCancelContainer />;
|
||||||
|
}
|
||||||
19
apps/portal/src/app/account/my-services/[id]/loading.tsx
Normal file
19
apps/portal/src/app/account/my-services/[id]/loading.tsx
Normal file
@ -0,0 +1,19 @@
|
|||||||
|
import { RouteLoading } from "@/components/molecules/RouteLoading";
|
||||||
|
import { ServerIcon } from "@heroicons/react/24/outline";
|
||||||
|
import { LoadingCard } from "@/components/atoms/loading-skeleton";
|
||||||
|
|
||||||
|
export default function AccountServiceDetailLoading() {
|
||||||
|
return (
|
||||||
|
<RouteLoading
|
||||||
|
icon={<ServerIcon />}
|
||||||
|
title="Service"
|
||||||
|
description="Service details"
|
||||||
|
mode="content"
|
||||||
|
>
|
||||||
|
<div className="space-y-4">
|
||||||
|
<LoadingCard />
|
||||||
|
<LoadingCard />
|
||||||
|
</div>
|
||||||
|
</RouteLoading>
|
||||||
|
);
|
||||||
|
}
|
||||||
5
apps/portal/src/app/account/my-services/[id]/page.tsx
Normal file
5
apps/portal/src/app/account/my-services/[id]/page.tsx
Normal file
@ -0,0 +1,5 @@
|
|||||||
|
import SubscriptionDetailContainer from "@/features/subscriptions/views/SubscriptionDetail";
|
||||||
|
|
||||||
|
export default function AccountServiceDetailPage() {
|
||||||
|
return <SubscriptionDetailContainer />;
|
||||||
|
}
|
||||||
@ -0,0 +1,5 @@
|
|||||||
|
import SimCallHistoryContainer from "@/features/subscriptions/views/SimCallHistory";
|
||||||
|
|
||||||
|
export default function AccountSimCallHistoryPage() {
|
||||||
|
return <SimCallHistoryContainer />;
|
||||||
|
}
|
||||||
@ -0,0 +1,5 @@
|
|||||||
|
import SimCancelContainer from "@/features/subscriptions/views/SimCancel";
|
||||||
|
|
||||||
|
export default function AccountSimCancelPage() {
|
||||||
|
return <SimCancelContainer />;
|
||||||
|
}
|
||||||
@ -0,0 +1,5 @@
|
|||||||
|
import SimChangePlanContainer from "@/features/subscriptions/views/SimChangePlan";
|
||||||
|
|
||||||
|
export default function AccountSimChangePlanPage() {
|
||||||
|
return <SimChangePlanContainer />;
|
||||||
|
}
|
||||||
@ -0,0 +1,5 @@
|
|||||||
|
import SimReissueContainer from "@/features/subscriptions/views/SimReissue";
|
||||||
|
|
||||||
|
export default function AccountSimReissuePage() {
|
||||||
|
return <SimReissueContainer />;
|
||||||
|
}
|
||||||
@ -0,0 +1,5 @@
|
|||||||
|
import SimTopUpContainer from "@/features/subscriptions/views/SimTopUp";
|
||||||
|
|
||||||
|
export default function AccountSimTopUpPage() {
|
||||||
|
return <SimTopUpContainer />;
|
||||||
|
}
|
||||||
16
apps/portal/src/app/account/my-services/loading.tsx
Normal file
16
apps/portal/src/app/account/my-services/loading.tsx
Normal file
@ -0,0 +1,16 @@
|
|||||||
|
import { RouteLoading } from "@/components/molecules/RouteLoading";
|
||||||
|
import { ServerIcon } from "@heroicons/react/24/outline";
|
||||||
|
import { LoadingTable } from "@/components/atoms/loading-skeleton";
|
||||||
|
|
||||||
|
export default function AccountServicesLoading() {
|
||||||
|
return (
|
||||||
|
<RouteLoading
|
||||||
|
icon={<ServerIcon />}
|
||||||
|
title="Services"
|
||||||
|
description="View and manage your services"
|
||||||
|
mode="content"
|
||||||
|
>
|
||||||
|
<LoadingTable rows={6} columns={5} />
|
||||||
|
</RouteLoading>
|
||||||
|
);
|
||||||
|
}
|
||||||
5
apps/portal/src/app/account/my-services/page.tsx
Normal file
5
apps/portal/src/app/account/my-services/page.tsx
Normal file
@ -0,0 +1,5 @@
|
|||||||
|
import SubscriptionsListContainer from "@/features/subscriptions/views/SubscriptionsList";
|
||||||
|
|
||||||
|
export default function AccountServicesPage() {
|
||||||
|
return <SubscriptionsListContainer />;
|
||||||
|
}
|
||||||
@ -0,0 +1,5 @@
|
|||||||
|
import { InternetConfigureContainer } from "@/features/catalog/views/InternetConfigure";
|
||||||
|
|
||||||
|
export default function AccountInternetConfigurePage() {
|
||||||
|
return <InternetConfigureContainer />;
|
||||||
|
}
|
||||||
5
apps/portal/src/app/account/services/internet/page.tsx
Normal file
5
apps/portal/src/app/account/services/internet/page.tsx
Normal file
@ -0,0 +1,5 @@
|
|||||||
|
import { InternetPlansContainer } from "@/features/catalog/views/InternetPlans";
|
||||||
|
|
||||||
|
export default function AccountInternetPlansPage() {
|
||||||
|
return <InternetPlansContainer />;
|
||||||
|
}
|
||||||
5
apps/portal/src/app/account/services/layout.tsx
Normal file
5
apps/portal/src/app/account/services/layout.tsx
Normal file
@ -0,0 +1,5 @@
|
|||||||
|
import type { ReactNode } from "react";
|
||||||
|
|
||||||
|
export default function AccountShopLayout({ children }: { children: ReactNode }) {
|
||||||
|
return <>{children}</>;
|
||||||
|
}
|
||||||
@ -0,0 +1,5 @@
|
|||||||
|
import { SimConfigureContainer } from "@/features/catalog/views/SimConfigure";
|
||||||
|
|
||||||
|
export default function AccountSimConfigurePage() {
|
||||||
|
return <SimConfigureContainer />;
|
||||||
|
}
|
||||||
5
apps/portal/src/app/account/services/sim/page.tsx
Normal file
5
apps/portal/src/app/account/services/sim/page.tsx
Normal file
@ -0,0 +1,5 @@
|
|||||||
|
import { SimPlansContainer } from "@/features/catalog/views/SimPlans";
|
||||||
|
|
||||||
|
export default function AccountSimPlansPage() {
|
||||||
|
return <SimPlansContainer />;
|
||||||
|
}
|
||||||
5
apps/portal/src/app/account/services/vpn/page.tsx
Normal file
5
apps/portal/src/app/account/services/vpn/page.tsx
Normal file
@ -0,0 +1,5 @@
|
|||||||
|
import { VpnPlansView } from "@/features/catalog/views/VpnPlans";
|
||||||
|
|
||||||
|
export default function AccountVpnPlansPage() {
|
||||||
|
return <VpnPlansView />;
|
||||||
|
}
|
||||||
124
apps/portal/src/components/organisms/SiteFooter/SiteFooter.tsx
Normal file
124
apps/portal/src/components/organisms/SiteFooter/SiteFooter.tsx
Normal file
@ -0,0 +1,124 @@
|
|||||||
|
/**
|
||||||
|
* SiteFooter
|
||||||
|
*
|
||||||
|
* Shared footer component for all public-facing pages.
|
||||||
|
* Contains company info, address, services links, and company links.
|
||||||
|
*/
|
||||||
|
|
||||||
|
import Link from "next/link";
|
||||||
|
import { Logo } from "@/components/atoms/logo";
|
||||||
|
import { PhoneIcon, MapPinIcon } from "@heroicons/react/24/outline";
|
||||||
|
|
||||||
|
export function SiteFooter() {
|
||||||
|
return (
|
||||||
|
<footer className="border-t border-border/40 bg-muted/30">
|
||||||
|
<div className="max-w-[var(--cp-page-max-width)] mx-auto px-[var(--cp-page-padding)] py-12">
|
||||||
|
<div className="grid grid-cols-1 md:grid-cols-4 gap-8 mb-8">
|
||||||
|
{/* Company Info */}
|
||||||
|
<div className="md:col-span-2">
|
||||||
|
<Link href="/" className="inline-flex items-center gap-2.5 mb-4">
|
||||||
|
<span className="inline-flex items-center justify-center h-8 w-8 rounded-lg bg-primary/10 text-primary">
|
||||||
|
<Logo size={18} />
|
||||||
|
</span>
|
||||||
|
<span className="text-base font-bold text-foreground">Assist Solutions</span>
|
||||||
|
</Link>
|
||||||
|
<p className="text-sm text-muted-foreground mb-4 max-w-sm">
|
||||||
|
Serving Japan's international community with reliable IT solutions since 2002.
|
||||||
|
</p>
|
||||||
|
<div className="space-y-2 text-sm text-muted-foreground">
|
||||||
|
<div className="flex items-start gap-2">
|
||||||
|
<MapPinIcon className="h-4 w-4 mt-0.5 flex-shrink-0" />
|
||||||
|
<span>
|
||||||
|
3F Azabu Maruka Bldg., 3-8-2 Higashi Azabu,
|
||||||
|
<br />
|
||||||
|
Minato-ku, Tokyo 106-0044
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div className="flex items-center gap-2">
|
||||||
|
<PhoneIcon className="h-4 w-4 flex-shrink-0" />
|
||||||
|
<span>
|
||||||
|
<a href="tel:0120-660-470" className="hover:text-foreground transition-colors">
|
||||||
|
0120-660-470
|
||||||
|
</a>{" "}
|
||||||
|
(Toll Free)
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Services */}
|
||||||
|
<div>
|
||||||
|
<h3 className="text-sm font-semibold text-foreground mb-4">Services</h3>
|
||||||
|
<ul className="space-y-2 text-sm">
|
||||||
|
<li>
|
||||||
|
<Link
|
||||||
|
href="/services/internet"
|
||||||
|
className="text-muted-foreground hover:text-foreground transition-colors"
|
||||||
|
>
|
||||||
|
Internet
|
||||||
|
</Link>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<Link
|
||||||
|
href="/services/sim"
|
||||||
|
className="text-muted-foreground hover:text-foreground transition-colors"
|
||||||
|
>
|
||||||
|
SIM & eSIM
|
||||||
|
</Link>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<Link
|
||||||
|
href="/services/vpn"
|
||||||
|
className="text-muted-foreground hover:text-foreground transition-colors"
|
||||||
|
>
|
||||||
|
VPN
|
||||||
|
</Link>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Company */}
|
||||||
|
<div>
|
||||||
|
<h3 className="text-sm font-semibold text-foreground mb-4">Company</h3>
|
||||||
|
<ul className="space-y-2 text-sm">
|
||||||
|
<li>
|
||||||
|
<Link
|
||||||
|
href="/about"
|
||||||
|
className="text-muted-foreground hover:text-foreground transition-colors"
|
||||||
|
>
|
||||||
|
About Us
|
||||||
|
</Link>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<Link
|
||||||
|
href="/contact"
|
||||||
|
className="text-muted-foreground hover:text-foreground transition-colors"
|
||||||
|
>
|
||||||
|
Contact
|
||||||
|
</Link>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<Link
|
||||||
|
href="/help"
|
||||||
|
className="text-muted-foreground hover:text-foreground transition-colors"
|
||||||
|
>
|
||||||
|
Support
|
||||||
|
</Link>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Bottom Bar */}
|
||||||
|
<div className="pt-8 border-t border-border/40 flex flex-col sm:flex-row items-center justify-between gap-4">
|
||||||
|
<div className="text-sm text-muted-foreground">
|
||||||
|
© {new Date().getFullYear()} Assist Solutions Corp. All rights reserved.
|
||||||
|
</div>
|
||||||
|
<div className="text-xs text-muted-foreground">
|
||||||
|
Notified Telecommunication Carrier: A-19-9538
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
);
|
||||||
|
}
|
||||||
1
apps/portal/src/components/organisms/SiteFooter/index.ts
Normal file
1
apps/portal/src/components/organisms/SiteFooter/index.ts
Normal file
@ -0,0 +1 @@
|
|||||||
|
export { SiteFooter } from "./SiteFooter";
|
||||||
@ -0,0 +1,2 @@
|
|||||||
|
export { PublicShell } from "./PublicShell";
|
||||||
|
export type { PublicShellProps } from "./PublicShell";
|
||||||
@ -0,0 +1,36 @@
|
|||||||
|
"use client";
|
||||||
|
|
||||||
|
import { useEffect } from "react";
|
||||||
|
import { usePathname, useRouter, useSearchParams } from "next/navigation";
|
||||||
|
import { useAuthStore } from "@/features/auth/services/auth.store";
|
||||||
|
|
||||||
|
type Props = {
|
||||||
|
/**
|
||||||
|
* Absolute target path (no querystring). When omitted, the current pathname is transformed:
|
||||||
|
* `/services/...` -> `/account/services/...`.
|
||||||
|
*/
|
||||||
|
targetPath?: string;
|
||||||
|
};
|
||||||
|
|
||||||
|
export function RedirectAuthenticatedToAccountServices({ targetPath }: Props) {
|
||||||
|
const router = useRouter();
|
||||||
|
const pathname = usePathname();
|
||||||
|
const searchParams = useSearchParams();
|
||||||
|
const isAuthenticated = useAuthStore(state => state.isAuthenticated);
|
||||||
|
const hasCheckedAuth = useAuthStore(state => state.hasCheckedAuth);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (!hasCheckedAuth) return;
|
||||||
|
if (!isAuthenticated) return;
|
||||||
|
|
||||||
|
// Simple path transformation: /services/* → /account/services/*
|
||||||
|
const nextPath =
|
||||||
|
targetPath ??
|
||||||
|
(pathname.startsWith("/services") ? `/account${pathname}` : "/account/services");
|
||||||
|
|
||||||
|
const query = searchParams?.toString() ?? "";
|
||||||
|
router.replace(query ? `${nextPath}?${query}` : nextPath);
|
||||||
|
}, [hasCheckedAuth, isAuthenticated, pathname, router, searchParams, targetPath]);
|
||||||
|
|
||||||
|
return null;
|
||||||
|
}
|
||||||
@ -0,0 +1,17 @@
|
|||||||
|
"use client";
|
||||||
|
|
||||||
|
import { usePathname } from "next/navigation";
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Returns the active services base path for the current shell.
|
||||||
|
*
|
||||||
|
* - Public services: `/services`
|
||||||
|
* - Account services (inside AppShell): `/account/services`
|
||||||
|
*/
|
||||||
|
export function useServicesBasePath(): "/services" | "/account/services" {
|
||||||
|
const pathname = usePathname();
|
||||||
|
if (pathname.startsWith("/account/services")) {
|
||||||
|
return "/account/services";
|
||||||
|
}
|
||||||
|
return "/services";
|
||||||
|
}
|
||||||
204
apps/portal/src/features/marketing/views/AboutUsView.tsx
Normal file
204
apps/portal/src/features/marketing/views/AboutUsView.tsx
Normal file
@ -0,0 +1,204 @@
|
|||||||
|
"use client";
|
||||||
|
|
||||||
|
import {
|
||||||
|
BuildingOffice2Icon,
|
||||||
|
UserGroupIcon,
|
||||||
|
CalendarIcon,
|
||||||
|
BanknotesIcon,
|
||||||
|
PhoneIcon,
|
||||||
|
MapPinIcon,
|
||||||
|
ClockIcon,
|
||||||
|
CheckCircleIcon,
|
||||||
|
} from "@heroicons/react/24/outline";
|
||||||
|
|
||||||
|
/**
|
||||||
|
* AboutUsView - Corporate profile and company information
|
||||||
|
*
|
||||||
|
* Displays company background, corporate data, business activities,
|
||||||
|
* and mission statement for Assist Solutions.
|
||||||
|
*/
|
||||||
|
export function AboutUsView() {
|
||||||
|
return (
|
||||||
|
<div className="max-w-4xl mx-auto space-y-12">
|
||||||
|
{/* Header */}
|
||||||
|
<div className="text-center">
|
||||||
|
<h1 className="text-3xl sm:text-4xl font-bold text-foreground mb-4">About Us</h1>
|
||||||
|
<p className="text-lg text-muted-foreground max-w-2xl mx-auto leading-relaxed">
|
||||||
|
We specialize in serving Japan's international community with the most reliable and
|
||||||
|
cost-efficient IT solutions available.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Who We Are Section */}
|
||||||
|
<section className="bg-card rounded-2xl border border-border p-8 sm:p-10">
|
||||||
|
<div className="flex items-center gap-3 mb-6">
|
||||||
|
<div className="h-12 w-12 rounded-xl bg-primary/10 border border-primary/20 flex items-center justify-center">
|
||||||
|
<BuildingOffice2Icon className="h-6 w-6 text-primary" />
|
||||||
|
</div>
|
||||||
|
<h2 className="text-2xl font-bold text-foreground">Who We Are</h2>
|
||||||
|
</div>
|
||||||
|
<div className="space-y-4 text-muted-foreground leading-relaxed">
|
||||||
|
<p>
|
||||||
|
Assist Solutions Corp. is a privately-owned entrepreneurial IT service company. We
|
||||||
|
specialize in serving Japan's international community with the most reliable and
|
||||||
|
cost-efficient IT & TV solutions available.
|
||||||
|
</p>
|
||||||
|
<p>
|
||||||
|
We are dedicated to providing comfortable support for our customer's diverse needs
|
||||||
|
in both English and Japanese. We believe that our excellent bi-lingual support and
|
||||||
|
flexible service along with our knowledge and experience in the field are what sets us
|
||||||
|
apart from the rest of the information technology and broadcasting industry.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
{/* Corporate Data Section */}
|
||||||
|
<section className="bg-card rounded-2xl border border-border p-8 sm:p-10">
|
||||||
|
<div className="flex items-center gap-3 mb-6">
|
||||||
|
<div className="h-12 w-12 rounded-xl bg-primary/10 border border-primary/20 flex items-center justify-center">
|
||||||
|
<UserGroupIcon className="h-6 w-6 text-primary" />
|
||||||
|
</div>
|
||||||
|
<h2 className="text-2xl font-bold text-foreground">Corporate Data</h2>
|
||||||
|
</div>
|
||||||
|
<p className="text-muted-foreground mb-6">
|
||||||
|
Assist Solutions is a privately-owned entrepreneurial IT supporting company, focused on
|
||||||
|
the international community in Japan.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<div className="divide-y divide-border">
|
||||||
|
{/* Company Name */}
|
||||||
|
<div className="py-4 grid grid-cols-1 sm:grid-cols-3 gap-2">
|
||||||
|
<div className="font-medium text-foreground">Name</div>
|
||||||
|
<div className="sm:col-span-2 text-muted-foreground">
|
||||||
|
Assist Solutions Corp.
|
||||||
|
<br />
|
||||||
|
<span className="text-sm">(Notified Telecommunication Carrier: A-19-9538)</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Address */}
|
||||||
|
<div className="py-4 grid grid-cols-1 sm:grid-cols-3 gap-2">
|
||||||
|
<div className="font-medium text-foreground flex items-center gap-2">
|
||||||
|
<MapPinIcon className="h-4 w-4 text-primary" />
|
||||||
|
Address
|
||||||
|
</div>
|
||||||
|
<div className="sm:col-span-2 text-muted-foreground">
|
||||||
|
3F Azabu Maruka Bldg., 3-8-2 Higashi Azabu,
|
||||||
|
<br />
|
||||||
|
Minato-ku, Tokyo 106-0044
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Phone/Fax */}
|
||||||
|
<div className="py-4 grid grid-cols-1 sm:grid-cols-3 gap-2">
|
||||||
|
<div className="font-medium text-foreground flex items-center gap-2">
|
||||||
|
<PhoneIcon className="h-4 w-4 text-primary" />
|
||||||
|
Tel / Fax
|
||||||
|
</div>
|
||||||
|
<div className="sm:col-span-2 text-muted-foreground">
|
||||||
|
Tel: 03-3560-1006
|
||||||
|
<br />
|
||||||
|
Fax: 03-3560-1007
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Business Hours */}
|
||||||
|
<div className="py-4 grid grid-cols-1 sm:grid-cols-3 gap-2">
|
||||||
|
<div className="font-medium text-foreground flex items-center gap-2">
|
||||||
|
<ClockIcon className="h-4 w-4 text-primary" />
|
||||||
|
Business Hours
|
||||||
|
</div>
|
||||||
|
<div className="sm:col-span-2 text-muted-foreground space-y-1">
|
||||||
|
<div>Mon - Fri 9:30AM - 6:00PM — Customer Support Team</div>
|
||||||
|
<div>Mon - Fri 9:30AM - 6:00PM — In-office Tech Support Team</div>
|
||||||
|
<div>Mon - Sat 10:00AM - 9:00PM — Onsite Tech Support Team</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Representative */}
|
||||||
|
<div className="py-4 grid grid-cols-1 sm:grid-cols-3 gap-2">
|
||||||
|
<div className="font-medium text-foreground">Representative Director</div>
|
||||||
|
<div className="sm:col-span-2 text-muted-foreground">Daisuke Nagakawa</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Employees */}
|
||||||
|
<div className="py-4 grid grid-cols-1 sm:grid-cols-3 gap-2">
|
||||||
|
<div className="font-medium text-foreground">Employees</div>
|
||||||
|
<div className="sm:col-span-2 text-muted-foreground">
|
||||||
|
21 Staff Members (as of March 31st, 2025)
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Established */}
|
||||||
|
<div className="py-4 grid grid-cols-1 sm:grid-cols-3 gap-2">
|
||||||
|
<div className="font-medium text-foreground flex items-center gap-2">
|
||||||
|
<CalendarIcon className="h-4 w-4 text-primary" />
|
||||||
|
Established
|
||||||
|
</div>
|
||||||
|
<div className="sm:col-span-2 text-muted-foreground">March 8, 2002</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Capital */}
|
||||||
|
<div className="py-4 grid grid-cols-1 sm:grid-cols-3 gap-2">
|
||||||
|
<div className="font-medium text-foreground flex items-center gap-2">
|
||||||
|
<BanknotesIcon className="h-4 w-4 text-primary" />
|
||||||
|
Paid-in Capital
|
||||||
|
</div>
|
||||||
|
<div className="sm:col-span-2 text-muted-foreground">40,000,000 JPY</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
{/* Business Activities Section */}
|
||||||
|
<section className="bg-card rounded-2xl border border-border p-8 sm:p-10">
|
||||||
|
<h2 className="text-2xl font-bold text-foreground mb-6">Business Activities</h2>
|
||||||
|
<div className="grid grid-cols-1 sm:grid-cols-2 gap-3">
|
||||||
|
{[
|
||||||
|
"IT Consulting Services",
|
||||||
|
"TV Consulting Services",
|
||||||
|
"Internet Connection Service Provision (SonixNet ISP)",
|
||||||
|
"VPN Connection Service Provision (SonixNet US/UK Remote Access)",
|
||||||
|
"Agent for Telecommunication Services",
|
||||||
|
"Agent for Internet Services",
|
||||||
|
"Agent for TV Services",
|
||||||
|
"Onsite Support Service for IT",
|
||||||
|
"Onsite Support Service for TV",
|
||||||
|
"Server Management Service",
|
||||||
|
"Network Management Service",
|
||||||
|
].map((activity, index) => (
|
||||||
|
<div key={index} className="flex items-start gap-2">
|
||||||
|
<CheckCircleIcon className="h-5 w-5 text-primary flex-shrink-0 mt-0.5" />
|
||||||
|
<span className="text-muted-foreground">{activity}</span>
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
{/* Mission Statement Section */}
|
||||||
|
<section className="bg-gradient-to-br from-primary/5 to-transparent rounded-2xl border border-primary/20 p-8 sm:p-10">
|
||||||
|
<h2 className="text-2xl font-bold text-foreground mb-6">Mission Statement</h2>
|
||||||
|
<p className="text-muted-foreground mb-6 leading-relaxed">
|
||||||
|
We will achieve business success by pursuing the following:
|
||||||
|
</p>
|
||||||
|
<ul className="space-y-4">
|
||||||
|
{[
|
||||||
|
"Provide the most customer-oriented service in this industry in Japan.",
|
||||||
|
"Through our service, we save client's time and enrich customers' lives.",
|
||||||
|
"We always have the latest and most efficient knowledge required for our service.",
|
||||||
|
"Be a responsible participant in Japan's international community.",
|
||||||
|
"Maintain high ethical standards in all business activities.",
|
||||||
|
].map((mission, index) => (
|
||||||
|
<li key={index} className="flex items-start gap-3">
|
||||||
|
<span className="flex h-6 w-6 items-center justify-center rounded-full bg-primary/10 text-primary text-sm font-semibold flex-shrink-0">
|
||||||
|
{index + 1}
|
||||||
|
</span>
|
||||||
|
<span className="text-foreground leading-relaxed">{mission}</span>
|
||||||
|
</li>
|
||||||
|
))}
|
||||||
|
</ul>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default AboutUsView;
|
||||||
Loading…
x
Reference in New Issue
Block a user