diff --git a/www/app/(aboutAndPrivacy)/about.tsx b/www/app/(aboutAndPrivacy)/about.tsx new file mode 100644 index 00000000..6c6d1577 --- /dev/null +++ b/www/app/(aboutAndPrivacy)/about.tsx @@ -0,0 +1,28 @@ +"use client"; +import React, { useState } from "react"; +import FullscreenModal from "./fullsreenModal"; +import AboutContent from "./aboutContent"; + +type AboutProps = { + buttonText: string; +}; + +export default function About({ buttonText }: AboutProps) { + const [modalOpen, setModalOpen] = useState(false); + + return ( + <> + + {modalOpen && ( + setModalOpen(false)}> + + + )} + + ); +} diff --git a/www/app/(aboutAndPrivacy)/aboutContent.tsx b/www/app/(aboutAndPrivacy)/aboutContent.tsx new file mode 100644 index 00000000..5b2165aa --- /dev/null +++ b/www/app/(aboutAndPrivacy)/aboutContent.tsx @@ -0,0 +1,53 @@ +import { Paragraph, Subtitle, Title } from "../lib/textComponents"; + +export default () => ( +
+ About us + + Reflector is a transcription and summarization pipeline that transforms + audio into knowledge. The output is meeting minutes and topic summaries + enabling topic-specific analyses stored in your systems of record. This is + accomplished on your infrastructure - without 3rd parties - keeping your + data private, secure, and organized. + + FAQs + 1. How does it work? + + Reflector simplifies tasks, turning spoken words into organized + information. Just press "record" to start and "stop" to finish. You'll get + notes divided by topic, a meeting summary, and the option to download + recordings. + + 2. What makes Reflector different? + + Monadical prioritizes safeguarding your data. Reflector operates + exclusively on your infrastructure, ensuring guaranteed security. + + 3. Any industry-specific use cases? +

Absolutely! We have two custom deployments pre-built:

+ + 4. Who’s behind Reflector? + + Monadical is a cohesive and effective team that can connect seamlessly + into your workflows, and we are ready to integrate Reflector’s building + blocks into your custom tools. We’re committed to building software that + outlasts us 🐙. + + + + Contact us at{" "} + + hello@monadical.com + + +
+); diff --git a/www/app/(aboutAndPrivacy)/fullsreenModal.tsx b/www/app/(aboutAndPrivacy)/fullsreenModal.tsx new file mode 100644 index 00000000..fa5f3817 --- /dev/null +++ b/www/app/(aboutAndPrivacy)/fullsreenModal.tsx @@ -0,0 +1,36 @@ +import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; +import { faClose } from "@fortawesome/free-solid-svg-icons"; +import { MouseEventHandler } from "react"; + +type ModalProps = { + children: JSX.Element; + close: () => void; +}; +const cancelClick: MouseEventHandler = (event) => { + event.preventDefault(); + event.stopPropagation(); +}; + +export default function FullscreenModal(props: ModalProps) { + return ( +
+
+ +
+ {props.children} +
+
+
+ ); +} diff --git a/www/app/(aboutAndPrivacy)/privacy.tsx b/www/app/(aboutAndPrivacy)/privacy.tsx new file mode 100644 index 00000000..d352688f --- /dev/null +++ b/www/app/(aboutAndPrivacy)/privacy.tsx @@ -0,0 +1,28 @@ +"use client"; +import React, { useState } from "react"; +import FullscreenModal from "./fullsreenModal"; +import PrivacyContent from "./privacyContent"; + +type PrivacyProps = { + buttonText: string; +}; + +export default function Privacy({ buttonText }: PrivacyProps) { + const [modalOpen, setModalOpen] = useState(false); + + return ( + <> + + {modalOpen && ( + setModalOpen(false)}> + + + )} + + ); +} diff --git a/www/app/(aboutAndPrivacy)/privacyContent.tsx b/www/app/(aboutAndPrivacy)/privacyContent.tsx new file mode 100644 index 00000000..43c6ca97 --- /dev/null +++ b/www/app/(aboutAndPrivacy)/privacyContent.tsx @@ -0,0 +1,32 @@ +import { Paragraph, Title } from "../lib/textComponents"; + +export default () => ( +
+ Privacy Policy + Last updated on September 22, 2023 + + + Questions or Concerns: If you have any questions or concerns regarding + your data, please feel free to reach out to us at{" "} + + reflector@monadical.com + + +
+); diff --git a/www/app/layout.tsx b/www/app/layout.tsx index de423da8..3436c123 100644 --- a/www/app/layout.tsx +++ b/www/app/layout.tsx @@ -7,6 +7,8 @@ import { ErrorProvider } from "./(errors)/errorContext"; import ErrorMessage from "./(errors)/errorMessage"; import Image from "next/image"; import Link from "next/link"; +import About from "./(aboutAndPrivacy)/about"; +import Privacy from "./(aboutAndPrivacy)/privacy"; const poppins = Poppins({ subsets: ["latin"], weight: ["200", "400", "600"] }); @@ -59,7 +61,7 @@ export const metadata: Metadata = { export default function RootLayout({ children }) { return ( - + @@ -87,8 +89,12 @@ export default function RootLayout({ children }) {

- {/* Text link on the right */} - +
+ {/* Text link on the right */} + +  ·  + +
{children} diff --git a/www/app/lib/textComponents.tsx b/www/app/lib/textComponents.tsx new file mode 100644 index 00000000..fefd980d --- /dev/null +++ b/www/app/lib/textComponents.tsx @@ -0,0 +1,18 @@ +type SimpleProps = { + children: JSX.Element | string | (JSX.Element | string)[]; + className?: string; +}; + +const Title = ({ children, className }: SimpleProps) => ( +

+ {children} +

+); +const Subtitle = ({ children, className }: SimpleProps) => ( +

{children}

+); +const Paragraph = ({ children, className }: SimpleProps) => ( +

{children}

+); + +export { Title, Subtitle, Paragraph }; diff --git a/www/app/transcripts/new/page.tsx b/www/app/transcripts/new/page.tsx index 07a0b8b9..9c32bd8a 100644 --- a/www/app/transcripts/new/page.tsx +++ b/www/app/transcripts/new/page.tsx @@ -13,6 +13,8 @@ import LiveTrancription from "../liveTranscription"; import DisconnectedIndicator from "../disconnectedIndicator"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { faGear } from "@fortawesome/free-solid-svg-icons"; +import About from "../../(aboutAndPrivacy)/about"; +import Privacy from "../../(aboutAndPrivacy)/privacy"; const TranscriptCreate = () => { const [stream, setStream] = useState(null); @@ -95,51 +97,56 @@ const TranscriptCreate = () => { ) : ( <>
-
-
-

Reflector

-

- Meet Monadical's own Reflector, your audio ally for hassle-free - insights. -

-

- With real-time transcriptions, translations, and summaries, - Reflector captures and categorizes the details of your meetings - and events, all while keeping your data locked down tight on - your own infrastructure. Forget the scribbled notes, endless - recordings, or third-party apps. Discover Reflector, a powerful - new way to elevate knowledge management and accessibility for - all. -

-
-
-
-

Audio Permissions

- {loading ? ( -

- Checking permission... +

+
+
+
+

+ Welcome to reflector.media +

+

+ Reflector is a transcription and summarization pipeline that + transforms audio into knowledge. The output is meeting + minutes and topic summaries enabling topic-specific analyses + stored in your systems of record. This is accomplished on + your infrastructure - without 3rd parties - keeping your + data private, secure, and organized.

- ) : ( - <> + +

+ Audio Permissions +

+ {loading ? (

- Reflector needs access to your microphone to work. -
- {permissionDenied - ? "Please reset microphone permissions to continue." - : "Please grant permission to continue."} + Checking permission...

- - - )} + ) : ( + <> +

+ To enable Reflector, we kindly request permission to + access your microphone during meetings and events. +
+ +
+ {permissionDenied + ? "Permission to use your microphone was denied, please change the permission setting in your browser and refresh this page." + : "Please grant permission to continue."} +

+ + + )} +
-
-
+ + )}