From 0d0c5dcfe372028bd4512ab720e6b1a33dc7bb84 Mon Sep 17 00:00:00 2001 From: Emmyn5600 Date: Wed, 6 Mar 2024 12:50:47 +0200 Subject: [PATCH 1/2] adding tos component --- packages/app/src/pages/app/TOS/index.tsx | 171 +++++++++++++++++++++++ 1 file changed, 171 insertions(+) create mode 100644 packages/app/src/pages/app/TOS/index.tsx diff --git a/packages/app/src/pages/app/TOS/index.tsx b/packages/app/src/pages/app/TOS/index.tsx new file mode 100644 index 0000000..dc3f462 --- /dev/null +++ b/packages/app/src/pages/app/TOS/index.tsx @@ -0,0 +1,171 @@ +import React from "react"; + +type Props = {}; + +const TermsOfService = () => { + return ( +
+
+

Acceptance of Terms

+

+ These Terms of Service ("Terms") form an agreement between you + ("User", "you") and Cojourney Corporation ("Cojourney", "Company", + "we", "us"). They apply to the website available at cojourney.chat + (the "Website"), and the Cojourney mobile application (the "App"), + collectively referred to as the "Services." +

+

+ By accessing or using the Services, you agree to these Terms. If you + do not understand or agree, please refrain from using the Services. +

+

+ If the Services are used on behalf of an entity, "you" also includes + that entity, with the assurance that you are an authorized + representative with the authority to bind the entity to these Terms. +

+

+ NOTE: THESE TERMS INCLUDE AN ARBITRATION CLAUSE AND A WAIVER OF CLASS + ACTION RIGHTS. +

+
+ + {/* Registration and Account Management */} +
+

+ Registration and Account Management +

+

+ You must provide accurate and complete information when creating an + account. If you are under 13, or an EU citizen or resident under 16, + you are not permitted to use the Services. +

+

+ You are responsible for all activities under your account and + maintaining its confidentiality. Notify us immediately at{" "} + + support@cojourney.chat + {" "} + of any unauthorized use. +

+
+ + {/* User Conduct and Content */} +
+

User Conduct and Content

+

+ You are solely responsible for your conduct and any content you submit + to the Services. Do not upload content that infringes rights, contains + harmful code, or engages in unlawful or objectionable activities. +

+
+ + {/* Intellectual Property Rights */} +
+

+ Intellectual Property Rights +

+

+ You retain ownership of content you submit but grant Cojourney a broad + license to use that content. Cojourney trademarks must not be used + without prior consent. +

+
+ + {/* Third-Party Services */} +
+

Third-Party Services

+

+ We are not liable for third-party services or content accessed through + the Services. +

+
+ + {/* Indemnification */} +
+

Indemnification

+

+ You agree to indemnify and hold harmless Cojourney from any claims + arising from your use of the Services. +

+
+ + {/* Disclaimer of Warranty */} +
+

Disclaimer of Warranty

+

+ The Services are provided "as is" without any warranties. Cojourney + disclaims all warranties, express or implied. +

+
+ + {/* Limitation of Liability */} +
+

Limitation of Liability

+

+ Cojourney's liability is limited under these Terms. You may not claim + punitive or incidental damages. +

+
+ + {/* Dispute Resolution */} +
+

Dispute Resolution

+

+ Disputes will be resolved through binding arbitration, and you waive + the right to participate in class actions. +

+
+ + {/* Termination */} +
+

Termination

+

+ Cojourney may terminate or suspend your access to the Services for any + reason, including inactivity or violation of these Terms. +

+
+ + {/* General Provisions */} +
+

General Provisions

+

+ These Terms constitute the entire agreement between you and Cojourney + and are governed by the laws of California, USA. +

+
+ + {/* Contact Information */} +
+

Contact Information

+

+ Questions or comments about the Services can be directed to{" "} + + support@cojourney.chat + + . +

+
+ + {/* Changes to Terms */} +
+

Changes to Terms

+

+ We reserve the right to modify these Terms at any time. By continuing + to use the Services, you agree to accept such modifications. +

+
+
+ ); +}; + +function index({}: Props) { + return
index
; +} + +export default index; From 675a8402d373663a7434f00c6c9d455507207f74 Mon Sep 17 00:00:00 2001 From: Emmyn5600 Date: Wed, 6 Mar 2024 18:33:09 +0200 Subject: [PATCH 2/2] styling tos page --- packages/app/src/App.tsx | 231 ++++++++-------- packages/app/src/pages/app/TOS/index.tsx | 277 ++++++++++++++------ packages/app/src/pages/app/useRootStyles.ts | 80 +++--- 3 files changed, 361 insertions(+), 227 deletions(-) diff --git a/packages/app/src/App.tsx b/packages/app/src/App.tsx index d73a7f2..fdb56c9 100644 --- a/packages/app/src/App.tsx +++ b/packages/app/src/App.tsx @@ -1,120 +1,125 @@ -import { MantineProvider } from "@mantine/core" -import { ModalsProvider } from "@mantine/modals" -import { Notifications } from "@mantine/notifications" -import { SessionContextProvider } from "@supabase/auth-helpers-react" -import { createClient } from "@supabase/supabase-js" -import { PostHogProvider } from "posthog-js/react" -import React from "react" -import { createBrowserRouter, RouterProvider } from "react-router-dom" -import "./App.css" -import LoadingOverlay from "./components/LoadingOverlay/LoadingOverlay" -import OAuthUser from "./components/OAuthUser" -import constants from "./constants/constants" -import Error404 from "./pages/404/Error404" -import FriendProfile from "./pages/app/FriendProfile" -import RoomLayout from "./pages/app/Room/index" -import Root from "./pages/app/root" -import UserPreferences from "./pages/app/UserPreferences/UserPreferences" -import UserProfile from "./pages/app/UserProfile" +import { MantineProvider } from "@mantine/core"; +import { ModalsProvider } from "@mantine/modals"; +import { Notifications } from "@mantine/notifications"; +import { SessionContextProvider } from "@supabase/auth-helpers-react"; +import { createClient } from "@supabase/supabase-js"; +import { PostHogProvider } from "posthog-js/react"; +import React from "react"; +import { createBrowserRouter, RouterProvider } from "react-router-dom"; +import "./App.css"; +import LoadingOverlay from "./components/LoadingOverlay/LoadingOverlay"; +import OAuthUser from "./components/OAuthUser"; +import constants from "./constants/constants"; +import Error404 from "./pages/404/Error404"; +import FriendProfile from "./pages/app/FriendProfile"; +import RoomLayout from "./pages/app/Room/index"; +import Root from "./pages/app/root"; +import UserPreferences from "./pages/app/UserPreferences/UserPreferences"; +import UserProfile from "./pages/app/UserProfile"; +import Tos from "./pages/app/Tos"; const supabase = createClient( - constants.supabaseUrl || "", - constants.supabaseAnonKey || "" -) + constants.supabaseUrl || "", + constants.supabaseAnonKey || "" +); const router = createBrowserRouter([ - { - path: "/", - element: , - errorElement: , - children: [ - { - path: "/chat/:roomId", - element: - }, - { - path: "/account", - element: - }, - { - path: "/profile", - element: - }, - { - path: "/friend", - element: - } - ] - }, - { - path: "/login", - element: - } -]) + { + path: "/", + element: , + errorElement: , + children: [ + { + path: "/chat/:roomId", + element: , + }, + { + path: "/account", + element: , + }, + { + path: "/profile", + element: , + }, + { + path: "/friend", + element: , + }, + ], + }, + { + path: "/tos", + element: , + }, + { + path: "/login", + element: , + }, +]); const App = (): JSX.Element => { - return ( - - - - - - - - - - - - ) -} + return ( + + + + + + + + + + + + ); +}; -export default App +export default App; diff --git a/packages/app/src/pages/app/TOS/index.tsx b/packages/app/src/pages/app/TOS/index.tsx index dc3f462..bb7b243 100644 --- a/packages/app/src/pages/app/TOS/index.tsx +++ b/packages/app/src/pages/app/TOS/index.tsx @@ -1,45 +1,58 @@ -import React from "react"; +import React, { useState } from "react"; +import { useSession, useSupabaseClient } from "@supabase/auth-helpers-react"; +import useGlobalStore from "../../../store/useGlobalStore"; +import { + Button, + Container, + Text, + Checkbox, + Flex, + Box, + ScrollArea, +} from "@mantine/core"; +import useRootStyles from "../useRootStyles"; type Props = {}; const TermsOfService = () => { return ( -
-
-

Acceptance of Terms

-

+ +

+ + Acceptance of Terms + + These Terms of Service ("Terms") form an agreement between you ("User", "you") and Cojourney Corporation ("Cojourney", "Company", "we", "us"). They apply to the website available at cojourney.chat (the "Website"), and the Cojourney mobile application (the "App"), collectively referred to as the "Services." -

-

+ + By accessing or using the Services, you agree to these Terms. If you do not understand or agree, please refrain from using the Services. -

-

+ + If the Services are used on behalf of an entity, "you" also includes that entity, with the assurance that you are an authorized representative with the authority to bind the entity to these Terms. -

-

+ + NOTE: THESE TERMS INCLUDE AN ARBITRATION CLAUSE AND A WAIVER OF CLASS ACTION RIGHTS. -

+
- {/* Registration and Account Management */} -
-

+
+ Registration and Account Management -

-

- You must provide accurate and complete information when creating an - account. If you are under 13, or an EU citizen or resident under 16, - you are not permitted to use the Services. -

-

+ + + You must provide accurate and complete information when creating an // + account. If you are under 18, or an EU citizen or resident under 16, + // you are not permitted to use the Services. + + You are responsible for all activities under your account and maintaining its confidentiality. Notify us immediately at{" "} { support@cojourney.chat {" "} of any unauthorized use. -

+
{/* User Conduct and Content */} -
-

User Conduct and Content

-

+

+ + User Conduct and Content + + You are solely responsible for your conduct and any content you submit to the Services. Do not upload content that infringes rights, contains harmful code, or engages in unlawful or objectionable activities. -

+
{/* Intellectual Property Rights */} -
-

+
+ Intellectual Property Rights -

-

+ + You retain ownership of content you submit but grant Cojourney a broad license to use that content. Cojourney trademarks must not be used without prior consent. -

+
{/* Third-Party Services */} -
-

Third-Party Services

-

+

+ + Third-Party Services + + We are not liable for third-party services or content accessed through the Services. -

+
{/* Indemnification */} -
-

Indemnification

-

+

+ + Indemnification + + You agree to indemnify and hold harmless Cojourney from any claims arising from your use of the Services. -

+
{/* Disclaimer of Warranty */} -
-

Disclaimer of Warranty

-

+

+ + Disclaimer of Warranty + + The Services are provided "as is" without any warranties. Cojourney disclaims all warranties, express or implied. -

+
{/* Limitation of Liability */} -
-

Limitation of Liability

-

+

+ + Limitation of Liability + + Cojourney's liability is limited under these Terms. You may not claim punitive or incidental damages. -

+
{/* Dispute Resolution */} -
-

Dispute Resolution

-

+

+ + Dispute Resolution + + Disputes will be resolved through binding arbitration, and you waive the right to participate in class actions. -

+
{/* Termination */} -
-

Termination

-

+

+ + Termination + + Cojourney may terminate or suspend your access to the Services for any reason, including inactivity or violation of these Terms. -

+
{/* General Provisions */} -
-

General Provisions

-

+

+ + General Provisions + + These Terms constitute the entire agreement between you and Cojourney and are governed by the laws of California, USA. -

+
{/* Contact Information */} -
-

Contact Information

-

+

+ + Contact Information + + Questions or comments about the Services can be directed to{" "} { support@cojourney.chat . -

+
- - {/* Changes to Terms */} -
-

Changes to Terms

-

+

+ + Changes to Terms + + We reserve the right to modify these Terms at any time. By continuing to use the Services, you agree to accept such modifications. -

+
-
+ ); }; -function index({}: Props) { - return
index
; +function Index({}: Props) { + const [oldEnough, setOldEnough] = useState(false); + const [agree, setAgree] = useState(false); + const { user } = useGlobalStore(); + const session = useSession(); + const supabase = useSupabaseClient(); + const { classes } = useRootStyles(); + + const completeAgreement = async () => { + // Your completeAgreement function logic + }; + + return ( +
+
+

COJOURNEY

+
+ +

+ Terms of Service +

+ + + + + + +
+ + + I agree that I am at least 18 years of age. + + { + setOldEnough(!oldEnough); + }} + style={{ marginLeft: "0.5rem" }} + /> + + + + I agree to the terms of service + + { + setAgree(!agree); + }} + style={{ marginLeft: "0.5rem" }} + /> + + + + +
+
+ ); } -export default index; +export default Index; diff --git a/packages/app/src/pages/app/useRootStyles.ts b/packages/app/src/pages/app/useRootStyles.ts index 6436e42..e375129 100644 --- a/packages/app/src/pages/app/useRootStyles.ts +++ b/packages/app/src/pages/app/useRootStyles.ts @@ -1,44 +1,44 @@ -import { createStyles } from "@mantine/core" -import { isSmartphone } from "../../helpers/functions" +import { createStyles } from "@mantine/core"; +import { isSmartphone } from "../../helpers/functions"; const useRootStyles = createStyles((theme) => ({ - container: { - marginLeft: 400, - "@media (max-width: 900px)": { - marginLeft: 0 - } - }, - content: { - height: "100vh", - backgroundSize: "cover", - backgroundPosition: "center", - maxWidth: "calc(100%)", - paddingTop: 0, - "@media (max-width: 900px)": { - marginTop: 60, - height: isSmartphone ? "calc(100vh - 130px)" : "calc(100vh - 60px)" - }, - "@media (max-width: 1200px)": { - maxWidth: "calc(100%)" - } - }, - header: { - position: "fixed", - top: 0, - left: 0, - width: "100vw", - padding: 15, - display: "flex", - justifyContent: "space-between", - backgroundColor: - theme.colorScheme === "dark" - ? theme.colors.dark[9] - : theme.colors.gray[1], + container: { + marginLeft: 400, + "@media (max-width: 900px)": { + marginLeft: 0, + }, + }, + content: { + height: "100vh", + backgroundSize: "cover", + backgroundPosition: "center", + maxWidth: "calc(100%)", + paddingTop: 0, + "@media (max-width: 900px)": { + marginTop: 60, + height: isSmartphone ? "calc(100vh - 130px)" : "calc(100vh - 60px)", + }, + "@media (max-width: 1200px)": { + maxWidth: "calc(100%)", + }, + }, + header: { + position: "fixed", + top: 0, + left: 0, + width: "100vw", + padding: 15, + display: "flex", + justifyContent: "space-between", + backgroundColor: + theme.colorScheme === "dark" + ? theme.colors.dark[9] + : theme.colors.gray[1], - borderBottom: `1px solid ${ - theme.colorScheme === "dark" ? theme.colors.dark[5] : theme.colors.gray[3] - }` - } -})) + borderBottom: `1px solid ${ + theme.colorScheme === "dark" ? theme.colors.dark[5] : theme.colors.gray[3] + }`, + }, +})); -export default useRootStyles +export default useRootStyles;