From fc00a87cf6a4e6be301478d37fa94276610eeaa0 Mon Sep 17 00:00:00 2001 From: Piyush Kumar Date: Tue, 17 Sep 2024 16:40:37 +0530 Subject: [PATCH] update website changes --- src/apps/devdoc/package.json | 2 +- src/apps/devdoc/pnpm-lock.yaml | 45 ++-- .../devdoc/web/components/page/index-new.tsx | 22 +- src/apps/devdoc/web/utils/config.tsx | 14 +- src/apps/devdoc/web/utils/const.tsx | 96 ++++--- src/apps/webinar/src/app/orgs/webinar-ui.tsx | 238 +++++++++++++----- 6 files changed, 270 insertions(+), 147 deletions(-) diff --git a/src/apps/devdoc/package.json b/src/apps/devdoc/package.json index abac059e6..40ee38491 100644 --- a/src/apps/devdoc/package.json +++ b/src/apps/devdoc/package.json @@ -48,6 +48,7 @@ "next-themes": "^0.2.1", "nextra": "^2.13.2", "nextra-theme-docs": "^2.13.2", + "postcss": "^8.4.47", "react": "^18.2.0", "react-dom": "^18.2.0", "react-fast-marquee": "^1.6.4", @@ -86,7 +87,6 @@ "eslint-plugin-react": "^7.33.2", "eslint-plugin-react-hooks": "^4.6.0", "next-sitemap": "^4.2.3", - "postcss": "12.1.5", "prettier": "^2.8.8", "tailwindcss": "^3.4.0", "typescript": "5.2.2" diff --git a/src/apps/devdoc/pnpm-lock.yaml b/src/apps/devdoc/pnpm-lock.yaml index cee06d6dd..634f03f11 100644 --- a/src/apps/devdoc/pnpm-lock.yaml +++ b/src/apps/devdoc/pnpm-lock.yaml @@ -98,6 +98,9 @@ dependencies: nextra-theme-docs: specifier: ^2.13.2 version: 2.13.4(next@14.2.8)(nextra@2.13.4)(react-dom@18.3.1)(react@18.3.1) + postcss: + specifier: ^8.4.47 + version: 8.4.47 react: specifier: ^18.2.0 version: 18.3.1 @@ -162,7 +165,7 @@ devDependencies: version: 6.21.0(eslint@8.57.0)(typescript@5.2.2) autoprefixer: specifier: ^10.4.16 - version: 10.4.20(postcss@8.4.45) + version: 10.4.20(postcss@8.4.47) eslint: specifier: ^8.56.0 version: 8.57.0 @@ -208,9 +211,6 @@ devDependencies: next-sitemap: specifier: ^4.2.3 version: 4.2.3(next@14.2.8) - postcss: - specifier: ^8.4.32 - version: 8.4.45 prettier: specifier: ^2.8.8 version: 2.8.8 @@ -3459,7 +3459,7 @@ packages: resolution: {integrity: sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q==} dev: false - /autoprefixer@10.4.20(postcss@8.4.45): + /autoprefixer@10.4.20(postcss@8.4.47): resolution: {integrity: sha512-XY25y5xSv/wEoqzDyXXME4AFfkZI0P23z6Fs3YgymDnKJkCGOnkL0iTxCa85UTqaSgfcqyf3UA6+c7wUvx/16g==} engines: {node: ^10 || ^12 || >=14} hasBin: true @@ -3471,7 +3471,7 @@ packages: fraction.js: 4.3.7 normalize-range: 0.1.2 picocolors: 1.1.0 - postcss: 8.4.45 + postcss: 8.4.47 postcss-value-parser: 4.2.0 dev: true @@ -8352,29 +8352,29 @@ packages: resolution: {integrity: sha512-d7Uw+eZoloe0EHDIYoe+bQ5WXnGMOpmiZFTuMWCwpjzzkL2nTjcKiAk4hh8TjnGye2TwWOk3UXucZ+3rbmBa8Q==} engines: {node: '>= 0.4'} - /postcss-import@15.1.0(postcss@8.4.45): + /postcss-import@15.1.0(postcss@8.4.47): resolution: {integrity: sha512-hpr+J05B2FVYUAXHeK1YyI267J/dDDhMU6B6civm8hSY1jYJnBXxzKDKDswzJmtLHryrjhnDjqqp/49t8FALew==} engines: {node: '>=14.0.0'} peerDependencies: postcss: ^8.0.0 dependencies: - postcss: 8.4.45 + postcss: 8.4.47 postcss-value-parser: 4.2.0 read-cache: 1.0.0 resolve: 1.22.8 dev: true - /postcss-js@4.0.1(postcss@8.4.45): + /postcss-js@4.0.1(postcss@8.4.47): resolution: {integrity: sha512-dDLF8pEO191hJMtlHFPRa8xsizHaM82MLfNkUHdUtVEV3tgTp5oj+8qbEqYM57SLfc74KSbw//4SeJma2LRVIw==} engines: {node: ^12 || ^14 || >= 16} peerDependencies: postcss: ^8.4.21 dependencies: camelcase-css: 2.0.1 - postcss: 8.4.45 + postcss: 8.4.47 dev: true - /postcss-load-config@4.0.2(postcss@8.4.45): + /postcss-load-config@4.0.2(postcss@8.4.47): resolution: {integrity: sha512-bSVhyJGL00wMVoPUzAVAnbEoWyqRxkjv64tUl427SKnPrENtq6hJwUojroMz2VB+Q1edmi4IfrAPpami5VVgMQ==} engines: {node: '>= 14'} peerDependencies: @@ -8387,17 +8387,17 @@ packages: optional: true dependencies: lilconfig: 3.1.2 - postcss: 8.4.45 + postcss: 8.4.47 yaml: 2.5.1 dev: true - /postcss-nested@6.2.0(postcss@8.4.45): + /postcss-nested@6.2.0(postcss@8.4.47): resolution: {integrity: sha512-HQbt28KulC5AJzG+cZtj9kvKB93CFCdLvog1WFLf1D+xmMvPGlBstkpTEZfK5+AN9hfJocyBFCNiqyS48bpgzQ==} engines: {node: '>=12.0'} peerDependencies: postcss: ^8.2.14 dependencies: - postcss: 8.4.45 + postcss: 8.4.47 postcss-selector-parser: 6.1.2 dev: true @@ -8421,14 +8421,13 @@ packages: picocolors: 1.1.0 source-map-js: 1.2.1 - /postcss@8.4.45: - resolution: {integrity: sha512-7KTLTdzdZZYscUc65XmjFiB73vBhBfbPztCYdUNvlaso9PrzjzcmjqBPR0lNGkcVlcO4BjiO5rK/qNz+XAen1Q==} + /postcss@8.4.47: + resolution: {integrity: sha512-56rxCq7G/XfB4EkXq9Egn5GCqugWvDFjafDOThIdMBsI15iqPqR5r15TfSr1YPYeEI19YeaXMCbY6u88Y76GLQ==} engines: {node: ^10 || ^12 || >=14} dependencies: nanoid: 3.3.7 picocolors: 1.1.0 source-map-js: 1.2.1 - dev: true /prelude-ls@1.2.1: resolution: {integrity: sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==} @@ -9550,11 +9549,11 @@ packages: normalize-path: 3.0.0 object-hash: 3.0.0 picocolors: 1.1.0 - postcss: 8.4.45 - postcss-import: 15.1.0(postcss@8.4.45) - postcss-js: 4.0.1(postcss@8.4.45) - postcss-load-config: 4.0.2(postcss@8.4.45) - postcss-nested: 6.2.0(postcss@8.4.45) + postcss: 8.4.47 + postcss-import: 15.1.0(postcss@8.4.47) + postcss-js: 4.0.1(postcss@8.4.47) + postcss-load-config: 4.0.2(postcss@8.4.47) + postcss-nested: 6.2.0(postcss@8.4.47) postcss-selector-parser: 6.1.2 resolve: 1.22.8 sucrase: 3.35.0 @@ -10337,7 +10336,7 @@ packages: resolution: {integrity: sha512-bXE4cR/kVZhKZX/RjPEflHaKVhUVl85noU3v6b8apfQEc1x4A+zBxjZ4lN8LqGd6WZ3dl98pY4o717VFmoPp+A==} file:../../design-system/out/kl-design-system-1.0.1.tgz(framer-motion@10.18.0)(react-dom@18.3.1)(react@18.3.1): - resolution: {integrity: sha512-oetCZ4l/auJBtk88ONXil1zjEUV76tFVCQap23+KPbjvg3n+Il0MK4Tgl3Tl8hHlc1zZ2YPTxD7WpWpYZlYjag==, tarball: file:../../design-system/out/kl-design-system-1.0.1.tgz} + resolution: {integrity: sha512-HXgczghmS1yoeqY0HuIHkekeeZId2m3dzynrpGK/WCjBQ+q2Gt46dTbW6QDCpseFpMYtzNa9VYKREd2Tqqf8WA==, tarball: file:../../design-system/out/kl-design-system-1.0.1.tgz} id: file:../../design-system/out/kl-design-system-1.0.1.tgz name: kl-design-system version: 1.0.1 diff --git a/src/apps/devdoc/web/components/page/index-new.tsx b/src/apps/devdoc/web/components/page/index-new.tsx index 4f6a83492..29b376121 100644 --- a/src/apps/devdoc/web/components/page/index-new.tsx +++ b/src/apps/devdoc/web/components/page/index-new.tsx @@ -1,9 +1,7 @@ -import { Badge } from 'kl-design-system/atoms/badge'; -import { GraphExtended } from '~/app/components/graph'; -import hero from '~/images/homeNew/hero'; -import HomeIllustrationMobileDark from '~/images/homeNew/illustration-mobile-dark.svg'; -import HomeIllustrationMobileWeb from '~/images/homeNew/illustration-mobile.webp'; import DynamicImage from '~/app/components/dynamic-image'; +import { GraphExtended } from '~/app/components/graph'; +import JoinProvidersDialog from '~/app/components/join-provider-dialog'; +import FaqSection from '~/app/components/website/home/faq'; import HowItWorksSection from '~/app/components/website/home/how-it-works'; import KeepExploring from '~/app/components/website/home/keep-exploring'; import KloudliteDevelopment from '~/app/components/website/home/kloudlite-development'; @@ -13,20 +11,14 @@ import PartnerSection from '~/app/components/website/home/partners'; import SecureAtCore from '~/app/components/website/home/secure-at-core'; import SuperCharge from '~/app/components/website/home/supercharge'; import Wrapper from '~/app/components/wrapper'; -import JoinProvidersDialog from '~/app/components/join-provider-dialog'; -import FaqSection from '~/app/components/website/home/faq'; -import Events from '../website/home/events'; +import hero from '~/images/homeNew/hero'; +import HomeIllustrationMobileDark from '~/images/homeNew/illustration-mobile-dark.svg'; +import HomeIllustrationMobileWeb from '~/images/homeNew/illustration-mobile.webp'; const Title = () => { return (
-
- - - Open-Source (Apache 2.0) - - -
+ {' '}

Building distributed applications diff --git a/src/apps/devdoc/web/utils/config.tsx b/src/apps/devdoc/web/utils/config.tsx index a9df52b2f..1658d6dc7 100644 --- a/src/apps/devdoc/web/utils/config.tsx +++ b/src/apps/devdoc/web/utils/config.tsx @@ -1,17 +1,17 @@ -import Link from 'next/link'; +import { DiscordLogo, YoutubeLogoFill } from '@jengaicons/react'; import { BrandLogo } from 'kl-design-system/branding/brand-logo'; +import Link from 'next/link'; import { GithubLogoFill, LinkedinLogoFill, TwitterNewLogoFill, } from '~/app/icons/icons'; -import OssIcon from '~/images/homeNew/oss.svg'; import OssIconDark from '~/images/homeNew/oss-dark.svg'; +import OssIcon from '~/images/homeNew/oss.svg'; +import ThemeSwitcher from '../components/theme-switcher'; import { cn } from './commons'; import { IConfig } from './use-config'; -import ThemeSwitcher from '../components/theme-switcher'; import { useTheme } from './useTheme'; -import { YoutubeLogoFill } from '@jengaicons/react'; export const siteDesc = 'Kloudlite is a remote-local development environment platform designed to streamline the workflow for developers working on distributed applications. By integrating both local and remote environments through Kubernetes, Kloudlite ensures a seamless, productive, and more connected development experience.'; @@ -25,6 +25,7 @@ export const communityUrl = export const changeLogUrl = 'https://github.com/kloudlite/kloudlite/releases'; const linkedinUrl = 'https://linkedin.com/company/kloudlite-io'; const youtubeUrl = 'https://youtube.com/@kloudliteofficial'; +const discordUrl = 'https://discord.gg/4Y7VHccg'; const xUrl = 'https://x.com/kloudlite'; export const supportEmail = 'launch@kloudlite.io'; const socialIconSize = 18; @@ -38,6 +39,9 @@ const SocialMenu = () => { + + + @@ -57,7 +61,7 @@ const BrandMenu = ({ className }: { className?: string }) => {
diff --git a/src/apps/devdoc/web/utils/const.tsx b/src/apps/devdoc/web/utils/const.tsx index a7be23f7c..903f03509 100644 --- a/src/apps/devdoc/web/utils/const.tsx +++ b/src/apps/devdoc/web/utils/const.tsx @@ -13,17 +13,17 @@ import { import Link from 'next/link'; import BlogCover from '~/public/blog/blog-cover.jpeg'; -import profileKarthik from '~/images/about-us/karthik-thirumalasetti.png'; +import profileAbdhesh from '~/images/about-us/abdhesh.jpeg'; import profileAditya from '~/images/about-us/aditya-sharma.png'; +import profileAnshuman from '~/images/about-us/ansuman.jpg'; +import profileBikash from '~/images/about-us/bikash.jpg'; +import profileHarsh from '~/images/about-us/harsh.png'; +import profileKarthik from '~/images/about-us/karthik-thirumalasetti.png'; +import profileMohit from '~/images/about-us/mohit.jpg'; import profilePavani from '~/images/about-us/pavani.png'; +import profilePiyush from '~/images/about-us/piyush.jpg'; import profileSrikanta from '~/images/about-us/s-srikanta.png'; -import profileHarsh from '~/images/about-us/harsh.png'; import profileShweta from '~/images/about-us/shewta.png'; -import profilePiyush from '~/images/about-us/piyush.jpg'; -import profileAbdhesh from '~/images/about-us/abdhesh.jpeg'; -import profileAnshuman from '~/images/about-us/ansuman.jpg'; -import profileMohit from '~/images/about-us/mohit.jpg'; -import profileBikash from '~/images/about-us/bikash.jpg'; import collaborate1440 from '~/images/homeNew/collaborate1440.svg'; import connect1440 from '~/images/homeNew/connect1440.svg'; @@ -57,9 +57,6 @@ import nocommitMobile from '~/images/homeNew/nocommitMobile.svg'; import explore from '~/images/explore.jpeg'; -import Collarative from '~/images/homeNew/exploring/collaborative.jpeg'; -import RemoteLocal from '~/images/homeNew/exploring/remote-local.jpeg'; -import Workflow from '~/images/homeNew/exploring/workflow.jpeg'; import { Agritech, AnscerRoboticsLogo, @@ -74,9 +71,15 @@ import { LockSimple, PlaxonicLogo, Robot, + RocketLaunch, SelectionForeground, Users, } from '~/app/icons/icons'; +import Collarative from '~/images/homeNew/exploring/collaborative.jpeg'; +import RemoteLocal from '~/images/homeNew/exploring/remote-local.jpeg'; +import Workflow from '~/images/homeNew/exploring/workflow.jpeg'; +import Button from '../components/button'; +import JoinProvidersDialog from '../components/join-provider-dialog'; import AnserSvg from '../icons/AnserRobotics'; import BoltzmanSvg from '../icons/Boltzman'; import CrewScaleSvg from '../icons/CrewScale'; @@ -84,8 +87,6 @@ import FibrSvg from '../icons/Fibr'; import PlaxonicSvg from '../icons/Plaxonic'; import RedPlutoSvg from '../icons/RedPluto'; import TalescaleSvg from '../icons/Talescale'; -import Button from '../components/button'; -import JoinProvidersDialog from '../components/join-provider-dialog'; import { authUrl } from './config'; export const linkedInPrefix = 'https://www.linkedin.com/in/'; @@ -237,18 +238,18 @@ const consts = { }, kloudliteDevelopmentData: [ { - label: 'Open source under Apache 2.0 Licences', + label: 'Open source', desc: 'No vendor lock-in, what so ever', icon: OpenSource, }, { - label: 'Instant Setup, Infinite Scale', - desc: 'Jump right into development with environments that scale as you grow', + label: 'Integrated workspaces', + desc: 'Develop in workspaces that are already connected to your application environments', icon: InfinityIcon, }, { label: 'No Build No Deploy, Just Code', - desc: 'Pre-built environments mean less setup and more coding', + desc: 'Intercept the service to swap remote application with your workspace', icon: Code, }, { @@ -258,13 +259,13 @@ const consts = { }, { - label: 'Seamless Collaboration Anywhere', - desc: 'Team up in real-time, in any environment, with zero hassle', + label: 'Seamless Collaboration', + desc: 'Switch into common environment to start collaboration', icon: Users, }, { label: 'Cut the Config Clutter', - desc: 'Manage configs and secrets centrally - keep your code clean and lean', + desc: 'No more configs in your code', icon: SelectionForeground, }, { @@ -273,7 +274,7 @@ const consts = { icon: LockSimple, }, { - label: 'Empower Innovation', + label: 'More time to code', desc: 'Free your focus for creativity with streamlined workflows', icon: Lightbulb, }, @@ -650,7 +651,7 @@ const consts = { environment. you can follow these instructions
+ ), + // desc: 'You can host kloudlite on your own infrastructure, giving you full control over the platform. Follow the setup instructions from this repo to get started.', }, ], }, @@ -840,7 +868,7 @@ const consts = { date: 'Sep 14, 2024', enabled: false, linkContent: 'Register today', - link: authUrl + '/signup', + link: `${authUrl}/signup`, }, contactUs: { cookies: { diff --git a/src/apps/webinar/src/app/orgs/webinar-ui.tsx b/src/apps/webinar/src/app/orgs/webinar-ui.tsx index cddbdf55a..a3261cc27 100644 --- a/src/apps/webinar/src/app/orgs/webinar-ui.tsx +++ b/src/apps/webinar/src/app/orgs/webinar-ui.tsx @@ -2,22 +2,34 @@ //@ts-ignore import { Button } from 'kl-design-system/atoms/button'; //@ts-ignore +import { TextInput } from 'kl-design-system/atoms/input'; +//@ts-ignore +import Popup from 'kl-design-system/molecule/popup'; +//@ts-ignore import { cn } from 'kl-design-system/utils'; -import useForm from '~/root/lib/client/hooks/use-form'; -import Yup from '~/root/lib/server/helpers/yup'; -import { handleError } from '~/root/lib/utils/common'; +// import Yup from '~/root/lib/server/helpers/yup'; +// import { handleError } from '~/root/lib/utils/common'; +import { useState } from 'react'; import Container from '../components/container'; import { JoinWebinar } from '../components/join-webinar'; + + export const WebinarUI = ({ userDetails, meetingStatus }: { userDetails: any, meetingStatus: string }) => { + + const [visible, setVisible] = useState(false); + return ( { + setVisible(true); + }} + // linkComponent={Link} + // to="/login" /> } > @@ -35,6 +47,7 @@ export const WebinarUI = ({ userDetails, meetingStatus }: { userDetails: any, me
+ {visible && }

) @@ -42,70 +55,157 @@ export const WebinarUI = ({ userDetails, meetingStatus }: { userDetails: any, me const HandleRegisterForm = ({ visible, setVisible }: { visible: boolean, setVisible: (v: boolean) => void }) => { - const { values, errors, handleChange, handleSubmit, resetValues, isLoading } = - useForm({ - initialValues: { - name: '', - companyName: '', - email: '', - }, + // const { values, errors, handleChange, handleSubmit, resetValues, isLoading } = + // useForm({ + // initialValues: { + // name: '', + // companyName: '', + // email: '', + // }, + + // // validationSchema: Yup.object({ + // // // name: Yup.string().required('id is required'), + // // }), + // validationSchema: null, + + // onSubmit: async (val) => { + // try { + // // if (!isUpdate) { + // // const { errors: e } = await api.createIotDeployment({ + // // projectName: project.name, + // // deployment: { + // // name: val.name, + // // displayName: val.displayName, + // // CIDR: val.cidr, + // // exposedIps: val.exposedIps, + // // exposedDomains: val.exposedDomains, + // // exposedServices: val.exposedServices.map((service) => { + // // return { + // // name: service.name, + // // ip: service.ip, + // // }; + // // }), + // // }, + // // }); + // // if (e) { + // // throw e[0]; + // // } + // // } else { + // // const { errors: e } = await api.updateIotDeployment({ + // // projectName: project.name, + // // deployment: { + // // name: val.name, + // // displayName: val.displayName, + // // CIDR: val.cidr, + // // exposedIps: val.exposedIps, + // // exposedDomains: val.exposedDomains, + // // exposedServices: val.exposedServices.map((service) => { + // // return { + // // name: service.name, + // // ip: service.ip, + // // }; + // // }), + // // }, + // // }); + // // if (e) { + // // throw e[0]; + // // } + // // } + // // reloadPage(); + // resetValues(); + // // toast.success( + // // `deployment ${isUpdate ? 'updated' : 'created'} successfully` + // // ); + // setVisible(false); + // } catch (err) { + // // handleError(err); + // } + // }, + // }); - validationSchema: Yup.object({ - name: Yup.string().required('id is required'), - }), - onSubmit: async (val) => { - try { - // if (!isUpdate) { - // const { errors: e } = await api.createIotDeployment({ - // projectName: project.name, - // deployment: { - // name: val.name, - // displayName: val.displayName, - // CIDR: val.cidr, - // exposedIps: val.exposedIps, - // exposedDomains: val.exposedDomains, - // exposedServices: val.exposedServices.map((service) => { - // return { - // name: service.name, - // ip: service.ip, - // }; - // }), - // }, - // }); - // if (e) { - // throw e[0]; - // } - // } else { - // const { errors: e } = await api.updateIotDeployment({ - // projectName: project.name, - // deployment: { - // name: val.name, - // displayName: val.displayName, - // CIDR: val.cidr, - // exposedIps: val.exposedIps, - // exposedDomains: val.exposedDomains, - // exposedServices: val.exposedServices.map((service) => { - // return { - // name: service.name, - // ip: service.ip, - // }; - // }), - // }, - // }); - // if (e) { - // throw e[0]; - // } - // } - // reloadPage(); - resetValues(); - // toast.success( - // `deployment ${isUpdate ? 'updated' : 'created'} successfully` - // ); - setVisible(false); - } catch (err) { - handleError(err); - } - }, - }); + return ( + { + // if (!values.isNameError) { + // handleSubmit(e); + // } else { + // e.preventDefault(); + // } + // }} + > + +
+ {/* */} + + + {/* []} + onChange={(val, v) => { + handleChange('exposedDomains')(dummyEvent(v)); + }} + error={!!errors.exposedDomains} + disableWhileLoading + /> */} + + {/* { + handleChange('exposedServices')(dummyEvent(items)); + }} + keyLabel="name" + valueLabel="ip" + error={!!errors.exposedServices} + message={errors.exposedServices} + /> */} +
+
+ + + + +
+ ) } \ No newline at end of file