diff --git a/package-lock.json b/package-lock.json index 797bb67..96f23bb 100644 --- a/package-lock.json +++ b/package-lock.json @@ -10,6 +10,7 @@ "dependencies": { "react": "^18.3.1", "react-dom": "^18.3.1", + "react-google-recaptcha": "^3.1.0", "react-router-dom": "^7.1.3" }, "devDependencies": { @@ -3182,6 +3183,15 @@ "node": ">= 0.4" } }, + "node_modules/hoist-non-react-statics": { + "version": "3.3.2", + "resolved": "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz", + "integrity": "sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==", + "license": "BSD-3-Clause", + "dependencies": { + "react-is": "^16.7.0" + } + }, "node_modules/ignore": { "version": "5.3.2", "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.2.tgz", @@ -3996,7 +4006,6 @@ "version": "4.1.1", "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz", "integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==", - "dev": true, "license": "MIT", "engines": { "node": ">=0.10.0" @@ -4483,7 +4492,6 @@ "version": "15.8.1", "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz", "integrity": "sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==", - "dev": true, "license": "MIT", "dependencies": { "loose-envify": "^1.4.0", @@ -4534,6 +4542,19 @@ "node": ">=0.10.0" } }, + "node_modules/react-async-script": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/react-async-script/-/react-async-script-1.2.0.tgz", + "integrity": "sha512-bCpkbm9JiAuMGhkqoAiC0lLkb40DJ0HOEJIku+9JDjxX3Rcs+ztEOG13wbrOskt3n2DTrjshhaQ/iay+SnGg5Q==", + "license": "MIT", + "dependencies": { + "hoist-non-react-statics": "^3.3.0", + "prop-types": "^15.5.0" + }, + "peerDependencies": { + "react": ">=16.4.1" + } + }, "node_modules/react-dom": { "version": "18.3.1", "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz", @@ -4547,11 +4568,23 @@ "react": "^18.3.1" } }, + "node_modules/react-google-recaptcha": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/react-google-recaptcha/-/react-google-recaptcha-3.1.0.tgz", + "integrity": "sha512-cYW2/DWas8nEKZGD7SCu9BSuVz8iOcOLHChHyi7upUuVhkpkhYG/6N3KDiTQ3XAiZ2UAZkfvYKMfAHOzBOcGEg==", + "license": "MIT", + "dependencies": { + "prop-types": "^15.5.0", + "react-async-script": "^1.2.0" + }, + "peerDependencies": { + "react": ">=16.4.1" + } + }, "node_modules/react-is": { "version": "16.13.1", "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==", - "dev": true, "license": "MIT" }, "node_modules/react-refresh": { diff --git a/package.json b/package.json index f8e479e..76cf9f4 100644 --- a/package.json +++ b/package.json @@ -12,6 +12,7 @@ "dependencies": { "react": "^18.3.1", "react-dom": "^18.3.1", + "react-google-recaptcha": "^3.1.0", "react-router-dom": "^7.1.3" }, "devDependencies": { diff --git a/src/components/beranda/Banner.jsx b/src/components/beranda/Banner.jsx index 63f3ec1..608a469 100644 --- a/src/components/beranda/Banner.jsx +++ b/src/components/beranda/Banner.jsx @@ -1,9 +1,7 @@ import { waIcon2, L1, L2, L3, L4, R1, R2, R3, R4, bgcBanner } from "../../assets/" -import { useNavigate } from "react-router-dom" +import { Link } from "react-router-dom" function Banner() { - const navigate = useNavigate(); - return (
Konsultasi Gratis - + - className="flex items-center justify-center w-full md:w-[270px] h-[50px] md:h-[65px] rounded-2xl px-4 md:px-8 py-2 md:py-3 border-[1px] border-white bg-gradient-to-r from-[#dc0168] to-[#5b59e8] text-white text-sm md:text-lg font-bold hover:opacity-90"> - Coba Sekarang -
diff --git a/src/components/beranda/Footer.jsx b/src/components/beranda/Footer.jsx index 1f3951f..dab4ae7 100644 --- a/src/components/beranda/Footer.jsx +++ b/src/components/beranda/Footer.jsx @@ -1,4 +1,4 @@ -import { useNavigate } from "react-router-dom" +import { useNavigate, Link } from "react-router-dom" import { nvidia, @@ -38,7 +38,6 @@ function Footer() {

-

Lebih dekat dengan Kami

{/* Tautan ke media sosial */} @@ -118,14 +117,12 @@ function Footer() {
  • + +
    • diff --git a/src/components/beranda/Header.jsx b/src/components/beranda/Header.jsx index aa3852a..6f0027e 100644 --- a/src/components/beranda/Header.jsx +++ b/src/components/beranda/Header.jsx @@ -72,7 +72,7 @@ const Header = () => { {isProdukOpen && ( -
    +
    {/* HR */} @@ -104,7 +104,7 @@ const Header = () => {

    Rekan Doku

    - Kelola dokumen digital + Kelola dokumen
    digital

    @@ -120,7 +120,7 @@ const Header = () => {

    Rekan LLM

    -

    Solusi analisis berbasis data

    +

    Solusi analisis berbasis
    data

    {/* VERI */} @@ -134,7 +134,7 @@ const Header = () => {

    Rekan Veri

    -

    Verifikasi data secara akurat

    +

    Verifikasi data secara
    akurat

    diff --git a/src/components/beranda/Hero.jsx b/src/components/beranda/Hero.jsx index 7a16f00..2d5b2bb 100644 --- a/src/components/beranda/Hero.jsx +++ b/src/components/beranda/Hero.jsx @@ -1,5 +1,5 @@ import { homeLogo, waIcon, homeImg } from '../../assets'; -import { useNavigate } from "react-router-dom" +import { useNavigate, Link } from "react-router-dom" function Hero() { const navigate = useNavigate(); @@ -30,11 +30,13 @@ function Hero() { WhatsApp Icon Konsultasi Gratis - + + + +
    diff --git a/src/components/beranda/Kenapa.jsx b/src/components/beranda/Kenapa.jsx index 829448a..ccb35c0 100644 --- a/src/components/beranda/Kenapa.jsx +++ b/src/components/beranda/Kenapa.jsx @@ -1,9 +1,7 @@ import { imgLeft, chek2, waIcon, circle1, circle2 } from '../../assets' -import { useNavigate } from "react-router-dom" +import { Link } from "react-router-dom" function Kenapa() { - const navigate = useNavigate(); - return (
    @@ -55,11 +53,12 @@ function Kenapa() { WhatsApp Icon Konsultasi Gratis - + + +
    diff --git a/src/components/beranda/MasaDepan.jsx b/src/components/beranda/MasaDepan.jsx index 56ca694..26fed31 100644 --- a/src/components/beranda/MasaDepan.jsx +++ b/src/components/beranda/MasaDepan.jsx @@ -1,11 +1,9 @@ import React from "react"; import { waIcon } from "../../assets"; -import { useNavigate } from "react-router-dom" +import { Link } from "react-router-dom" function MasaDepan() { - const navigate = useNavigate(); - return ( <>
    @@ -33,12 +31,12 @@ function MasaDepan() { WhatsApp Icon Konsultasi Gratis - + + +
    diff --git a/src/components/contact/FAQSection.jsx b/src/components/contact/FAQSection.jsx index ba7e200..6b2883a 100644 --- a/src/components/contact/FAQSection.jsx +++ b/src/components/contact/FAQSection.jsx @@ -1,6 +1,17 @@ -import { useState } from "react"; +import { useState, useEffect } from "react"; +import { useLocation } from "react-router-dom"; const FAQ = () => { + const location = useLocation(); + + useEffect(() => { + if (location.hash) { + const element = document.querySelector(location.hash); + if (element) { + element.scrollIntoView({ behavior: "smooth" }); + } + } + }, [location]); // State untuk menyimpan indeks pertanyaan yang sedang dibuka // Jika tidak ada pertanyaan yang terbuka, nilai adalah null const [openQuestion, setOpenQuestion] = useState(null); @@ -111,7 +122,7 @@ const FAQ = () => { ]; return ( -
    +
    {/* Judul halaman FAQ */}

    diff --git a/src/components/contact/FormSection.jsx b/src/components/contact/FormSection.jsx index 9222f38..9122826 100644 --- a/src/components/contact/FormSection.jsx +++ b/src/components/contact/FormSection.jsx @@ -1,11 +1,29 @@ -import { img10 } from "./asset"; +import { img10 } from "./asset"; // Pastikan img10 ada dan benar path-nya +import ReCAPTCHA from "react-google-recaptcha"; // Pastikan penulisan benar (ReCAPTCHA) +import useRecaptcha from './Recaptcha/useRecaptcha'; +import { useLocation } from "react-router-dom"; +import { useEffect } from "react"; const ContactForm = () => { + const { capchaToken, handleRecaptcha } = useRecaptcha(); + + const location = useLocation(); + + useEffect(() => { + if (location.hash) { + const element = document.querySelector(location.hash); + if (element) { + element.scrollIntoView({ behavior: "smooth" }); + } + } + }, [location]); + return (
    {
    {/* Bagian Kiri */}
    - {/* Judul utama */}

    - Isi formulir di samping ini dan kami akan menghubungi Anda secepat - mungkin + Isi formulir di samping ini dan kami akan menghubungi Anda secepat mungkin

    - - {/* Deskripsi tambahan */}

    - Kami percaya bahwa kolaborasi adalah kunci kesuksesan. Hubungi kami - hari ini, dan mari wujudkan masa depan bisnis Anda bersama Rekan AI! + Kami percaya bahwa kolaborasi adalah kunci kesuksesan. Hubungi kami hari ini, dan mari wujudkan masa depan bisnis Anda bersama Rekan AI!

    {/* Bagian Form */} - -
    - - - {/* Judul form */} +

    Hubungi Tim Terbaik Kami

    - {/* Deskripsi form */}

    Silakan isi data diri Anda pada formulir di bawah ini

    - {/* Formulir input */}
    - {/* Input Nama */}
    { className="w-full mt-1 p-4 border border-[#5B59E8] rounded-lg focus:ring-2 focus:ring-[#5B59E8] 2xl:p-5" />
    - - {/* Input Nomor Telepon */}
    { }} />
    - - {/* Input Email */}
    { className="w-full mt-1 p-4 border border-[#5B59E8] rounded-lg focus:ring-2 focus:ring-[#5B59E8] 2xl:p-5" />
    - - {/* Input Nama Organisasi */}
    - +
    - - {/* Dropdown Pilih Kebutuhan */}
    - {/* Tanda panah kustom */}
    {
    - {/* Checkbox Verifikasi */} + {/* ReCAPTCHA */}
    - - Saya bukan robot
    - {/* Tombol Kirim */} diff --git a/src/components/contact/Recaptcha/useRecaptcha.js b/src/components/contact/Recaptcha/useRecaptcha.js new file mode 100644 index 0000000..6b6768f --- /dev/null +++ b/src/components/contact/Recaptcha/useRecaptcha.js @@ -0,0 +1,23 @@ +import { useState, useRef } from "react"; + +const useRecaptcha = () => { + const [capchaToken, setCapchaToken] = useState(null); // Menyimpan token reCAPTCHA + const recaptchaRef = useRef(); // Menggunakan ref untuk reCAPTCHA jika perlu manipulasi lebih lanjut + + // Fungsi untuk menangani perubahan token setelah reCAPTCHA berhasil + const handleRecaptcha = (token) => { + if (token) { + setCapchaToken(token); // Set token jika berhasil + } else { + setCapchaToken(null); // Reset token jika tidak ada token + } + }; + + return { + capchaToken, // Mengembalikan token + recaptchaRef, // Referensi reCAPTCHA + handleRecaptcha, // Fungsi untuk menangani perubahan token + }; +}; + +export default useRecaptcha; diff --git a/src/components/solusi/HeadCorporate/HeadCorporate.jsx b/src/components/solusi/HeadCorporate/HeadCorporate.jsx index c16f348..fdcb9b5 100644 --- a/src/components/solusi/HeadCorporate/HeadCorporate.jsx +++ b/src/components/solusi/HeadCorporate/HeadCorporate.jsx @@ -1,5 +1,5 @@ +import { Link } from "react-router-dom"; import { component11, wagreen, hc } from "../asset"; - export default function HeadCorporate() { return (
    @@ -44,9 +44,11 @@ export default function HeadCorporate() { WhatsApp Icon Konsultasi Gratis - + + +
    diff --git a/src/components/solusi/HeadPersonal/HeadPersonal.jsx b/src/components/solusi/HeadPersonal/HeadPersonal.jsx index 013255d..76bced6 100644 --- a/src/components/solusi/HeadPersonal/HeadPersonal.jsx +++ b/src/components/solusi/HeadPersonal/HeadPersonal.jsx @@ -1,4 +1,5 @@ import { component11, wagreen, start22 } from "../asset"; +import { Link } from "react-router-dom"; export default function HeadPersonal() { return ( @@ -6,7 +7,7 @@ export default function HeadPersonal() {
    {/* Left Column */}
    - {/* Logo and Tagline */} + {/* Logo and Tagline */}
    Logo @@ -42,13 +43,16 @@ export default function HeadPersonal() { {/* Buttons - Ensure they come last on mobile */}
    - - + + + +
    diff --git a/src/components/solusi/HeadStartup/HeadStartup.jsx b/src/components/solusi/HeadStartup/HeadStartup.jsx index 245fc23..91ca8f2 100644 --- a/src/components/solusi/HeadStartup/HeadStartup.jsx +++ b/src/components/solusi/HeadStartup/HeadStartup.jsx @@ -1,5 +1,5 @@ import { component11, wagreen, hs } from "../asset"; - +import { Link } from "react-router-dom"; export default function HeadPersonal() { return (
    @@ -44,9 +44,11 @@ export default function HeadPersonal() { WhatsApp Icon Konsultasi Gratis + +
    diff --git a/src/components/solusi/MengapaCorporate/MengapaCorporate.jsx b/src/components/solusi/MengapaCorporate/MengapaCorporate.jsx index 502655e..39443fe 100644 --- a/src/components/solusi/MengapaCorporate/MengapaCorporate.jsx +++ b/src/components/solusi/MengapaCorporate/MengapaCorporate.jsx @@ -1,8 +1,8 @@ +import { Link } from "react-router-dom" import { chek2, wagreen, start33, start44, start55 } from "../asset" - function Kenapa() { return ( -
    +
    {/* Image Section */}
    @@ -15,9 +15,9 @@ function Kenapa() { {/* Text Section */}
    -

    Mengapa Rekan AI untuk Corporate Business?

    -

    - Rekan AI dirancang khusus untuk mendukung kebutuhan bisnis berskala besar dengan menghadirkan solusi yang dapat meningkatkan efisiensi, mempercepat proses, dan membantu pengambilan keputusan strategis. Dengan teknologi mutakhir yang fleksibel dan aman, Rekan AI menjadi mitra terpercaya dalam perjalanan transformasi digital perusahaan Anda. +

    Mengapa Rekan AI untuk Corporate Business?

    +

    + Rekan AI dirancang khusus untuk mendukung kebutuhan bisnis berskala besar dengan menghadirkan solusi yang dapat meningkatkan efisiensi, mempercepat proses, dan membantu pengambilan keputusan strategis. Dengan teknologi mutakhir yang fleksibel dan aman, Rekan AI menjadi mitra terpercaya dalam perjalanan transformasi digital perusahaan Anda.

    • @@ -41,9 +41,11 @@ function Kenapa() { /> Konsultasi Gratis - + + +
    diff --git a/src/components/solusi/MengapaStartup/MengapaStartup.jsx b/src/components/solusi/MengapaStartup/MengapaStartup.jsx index 17f7f54..6a86a2f 100644 --- a/src/components/solusi/MengapaStartup/MengapaStartup.jsx +++ b/src/components/solusi/MengapaStartup/MengapaStartup.jsx @@ -1,8 +1,8 @@ +import { Link } from "react-router-dom" import { chek2, wagreen, start44 } from "../asset" - function Kenapa() { return ( -
    +
    {/* Image Section */}
    @@ -15,8 +15,8 @@ function Kenapa() { {/* Text Section */}
    -

    Kenapa Memilih Rekan AI untuk Startup Anda?

    -

    +

    Kenapa Memilih Rekan AI untuk Startup Anda?

    +

    Startup adalah tulang punggung perekonomian, dan Rekan AI hadir untuk memberdayakan pelaku usaha agar dapat bersaing di era digital. Dengan solusi berbasis AI, kami membantu usaha kecil dan menengah mencapai efisiensi yang lebih baik, memperluas jangkauan pasar, dan meningkatkan kepuasan pelanggan.

      @@ -43,9 +43,11 @@ function Kenapa() { /> Konsultasi Gratis + +
    diff --git a/src/components/solusi/MengapapPersonal/MengapapPersonal.jsx b/src/components/solusi/MengapapPersonal/MengapapPersonal.jsx index 67d2d0a..ba0b6ff 100644 --- a/src/components/solusi/MengapapPersonal/MengapapPersonal.jsx +++ b/src/components/solusi/MengapapPersonal/MengapapPersonal.jsx @@ -1,8 +1,8 @@ import { chek2, wagreen, start33 } from "../asset" - +import { Link } from "react-router-dom" function Kenapa() { return ( -
    +
    {/* Image Section */}
    @@ -15,8 +15,8 @@ function Kenapa() { {/* Text Section */}
    -

    Mengapa Memilih Rekan AI untuk Penggunaan Pribadi?

    -

    +

    Mengapa Memilih Rekan AI untuk Penggunaan Pribadi?

    +

    Rekan AI hadir untuk memberikan kemudahan dan efisiensi bagi individu yang ingin memanfaatkan kecerdasan buatan dalam kehidupan sehari-hari. Apakah Anda ingin meningkatkan produktivitas, mengelola data dengan aman, atau membuat keputusan yang lebih cerdas, Rekan AI adalah solusi tepat yang dirancang khusus untuk @@ -46,9 +46,11 @@ function Kenapa() { /> Konsultasi Gratis - + + +

    diff --git a/src/components/solusi/SolusiCorporate/SolusiCorporate.jsx b/src/components/solusi/SolusiCorporate/SolusiCorporate.jsx index ecca628..b241592 100644 --- a/src/components/solusi/SolusiCorporate/SolusiCorporate.jsx +++ b/src/components/solusi/SolusiCorporate/SolusiCorporate.jsx @@ -34,7 +34,7 @@ export default function BusinessSolution() { {activeContent && (
    {/* Image Section */} -
    +
    {activeContent.title} {/* Text Content */} -
    +

    {activeContent.title}

    {activeContent.description}

    diff --git a/src/components/solusi/SolusiPersonal/SolusiPersonal.jsx b/src/components/solusi/SolusiPersonal/SolusiPersonal.jsx index ecca628..b241592 100644 --- a/src/components/solusi/SolusiPersonal/SolusiPersonal.jsx +++ b/src/components/solusi/SolusiPersonal/SolusiPersonal.jsx @@ -34,7 +34,7 @@ export default function BusinessSolution() { {activeContent && (
    {/* Image Section */} -
    +
    {activeContent.title} {/* Text Content */} -
    +

    {activeContent.title}

    {activeContent.description}

    diff --git a/src/components/solusi/SolusiStartup/SolusiStartup.jsx b/src/components/solusi/SolusiStartup/SolusiStartup.jsx index ecca628..b241592 100644 --- a/src/components/solusi/SolusiStartup/SolusiStartup.jsx +++ b/src/components/solusi/SolusiStartup/SolusiStartup.jsx @@ -34,7 +34,7 @@ export default function BusinessSolution() { {activeContent && (
    {/* Image Section */} -
    +
    {activeContent.title} {/* Text Content */} -
    +

    {activeContent.title}

    {activeContent.description}

    diff --git a/src/components/solusi/TransformasiCorpo/TransformasiCorpo.jsx b/src/components/solusi/TransformasiCorpo/TransformasiCorpo.jsx index 1499003..a116ea7 100644 --- a/src/components/solusi/TransformasiCorpo/TransformasiCorpo.jsx +++ b/src/components/solusi/TransformasiCorpo/TransformasiCorpo.jsx @@ -1,5 +1,5 @@ +import { Link } from "react-router-dom"; import { wagreen } from "../asset"; - function Transformasi() { return ( <> @@ -27,9 +27,11 @@ function Transformasi() { WhatsApp Icon Konsultasi Gratis + +
    diff --git a/src/components/solusi/TransformasiCorporate/TransformasiCorporate.jsx b/src/components/solusi/TransformasiCorporate/TransformasiCorporate.jsx index f32746b..1c57299 100644 --- a/src/components/solusi/TransformasiCorporate/TransformasiCorporate.jsx +++ b/src/components/solusi/TransformasiCorporate/TransformasiCorporate.jsx @@ -1,6 +1,6 @@ import React from "react"; import { wagreen } from "../asset"; - +import { Link } from "react-router-dom"; function MasaDepan() { return ( <> @@ -28,9 +28,11 @@ function MasaDepan() { WhatsApp Icon Konsultasi Gratis + +
    diff --git a/src/components/solusi/TransformasiPersonal/TransformasiPersonal.jsx b/src/components/solusi/TransformasiPersonal/TransformasiPersonal.jsx index dc3f49e..569fce6 100644 --- a/src/components/solusi/TransformasiPersonal/TransformasiPersonal.jsx +++ b/src/components/solusi/TransformasiPersonal/TransformasiPersonal.jsx @@ -1,5 +1,5 @@ import { wagreen } from "../asset"; - +import { Link } from "react-router-dom"; function Transformasi() { return ( <> @@ -31,9 +31,11 @@ function Transformasi() { WhatsApp Icon Konsultasi Gratis + +
    diff --git a/src/components/solusi/TransformasiStart/TransformasiStart.jsx b/src/components/solusi/TransformasiStart/TransformasiStart.jsx index fe44781..def22cc 100644 --- a/src/components/solusi/TransformasiStart/TransformasiStart.jsx +++ b/src/components/solusi/TransformasiStart/TransformasiStart.jsx @@ -1,5 +1,5 @@ +import { Link } from "react-router-dom"; import { wagreen } from "../asset"; - function Transformasi() { return ( <> @@ -31,9 +31,11 @@ function Transformasi() { WhatsApp Icon Konsultasi Gratis + +