diff --git a/frontend/apps/editor2d/src/Classes/ApiManager/UsersApi.ts b/frontend/apps/editor2d/src/Classes/ApiManager/UsersApi.ts index 21489374b3..410d7cbdbe 100644 --- a/frontend/apps/editor2d/src/Classes/ApiManager/UsersApi.ts +++ b/frontend/apps/editor2d/src/Classes/ApiManager/UsersApi.ts @@ -63,6 +63,7 @@ export class UsersApi extends ApiManager { password: string; }): Promise> { const endpoint = `${this.ApiTargets.BaseApi}/v1/login`; + const body = { username_or_email: usernameOrEmail, password: password, diff --git a/frontend/apps/editor2d/src/app/pages/login.tsx b/frontend/apps/editor2d/src/app/pages/login.tsx index 85dcd7b67c..733b9c878e 100644 --- a/frontend/apps/editor2d/src/app/pages/login.tsx +++ b/frontend/apps/editor2d/src/app/pages/login.tsx @@ -5,7 +5,7 @@ import { faKey, faUser } from "@fortawesome/pro-solid-svg-icons"; import { Button, Input, LoadingSpinner } from "~/components/ui"; import { authentication } from "~/signals"; import { twMerge } from "tailwind-merge"; - +import { UsersApi } from "@storyteller/api"; export const Login = () => { const { signals: { status: authStatus }, @@ -36,17 +36,21 @@ export const Login = () => { return "Getting Session..."; } - const handleOnSumbit = (ev: React.FormEvent) => { + const handleOnSumbit = async (ev: React.FormEvent) => { ev.preventDefault(); if (formRef.current) { const form = new FormData(formRef.current); const usernameOrEmail = form.get("usernameOrEmail")?.toString(); const password = form.get("password")?.toString(); - if (usernameOrEmail && password && login) { - login({ + + if (usernameOrEmail && password) { + let api = new UsersApi(); + + let response = await api.Login({ usernameOrEmail, password, }); + console.log("response", response); } } }; // end handleOnSubmit diff --git a/frontend/apps/editor2d/src/components/features/ToolbarUserProfile/ProfileDropdown.tsx b/frontend/apps/editor2d/src/components/features/ToolbarUserProfile/ProfileDropdown.tsx index b615398658..3e09dce67e 100644 --- a/frontend/apps/editor2d/src/components/features/ToolbarUserProfile/ProfileDropdown.tsx +++ b/frontend/apps/editor2d/src/components/features/ToolbarUserProfile/ProfileDropdown.tsx @@ -21,22 +21,9 @@ export function ProfileDropdown() { signals: { userInfo }, fetchers: { logout }, } = authentication; - + if (!userInfo.value) return null; - // Extract user info for better readability - const { - core_info: { - username, - gravatar_hash: emailHash, - display_name, - default_avatar: { - image_index: avatarIndex, - color_index: backgroundColorIndex, - }, - }, - } = userInfo.value; - const profileUrl = `https://storyteller.ai/profile/${display_name}`; const menuOptions = [ diff --git a/frontend/apps/editor2d/src/components/shared_authentication/AuthButtons.tsx b/frontend/apps/editor2d/src/components/shared_authentication/AuthButtons.tsx index ddf16746d2..753be0aaff 100644 --- a/frontend/apps/editor2d/src/components/shared_authentication/AuthButtons.tsx +++ b/frontend/apps/editor2d/src/components/shared_authentication/AuthButtons.tsx @@ -2,14 +2,16 @@ import { useSignals } from "@preact/signals-react/runtime"; // import { AUTH_STATUS } from "~/signals/authentication/enums"; // import { authentication } from "~/signals"; import { ButtonLink } from "~/components/reusable/ButtonLink/ButtonLink"; +import { ProfileDropdown } from "../features/ToolbarUserProfile/ProfileDropdown"; // import ProfileDropdown from "./ProfileDropdown"; // TODO MAKE THIS A SHARED COMPONENT ART CRAFT export const AuthButtons = () => { useSignals(); - //const { status } = authentication; + // const { status } = authentication; + // status.value === AUTH_STATUS.LOGGED_IN + if (false) { - // status.value === AUTH_STATUS.LOGGED_IN return ; } else { return ( diff --git a/frontend/apps/editor2d/src/components/shared_authentication/profiledropdown.tsx b/frontend/apps/editor2d/src/components/shared_authentication/profiledropdown.tsx deleted file mode 100644 index 5518e6fa55..0000000000 --- a/frontend/apps/editor2d/src/components/shared_authentication/profiledropdown.tsx +++ /dev/null @@ -1,191 +0,0 @@ -// import { faEnvelope, faKey, faUser } from "@fortawesome/pro-solid-svg-icons"; -// // import { GlobalSettingsManager } from "./pages/PageEnigma/GlobalSettingsManager"; -// import { Button } from "@storyteller/ui-button"; -// import { Input } from "@storyteller/ui-input"; - -// // import { addToast, authentication, signUp } from "~/signals"; -// import { FormEvent, useRef, useState, StrictMode } from "react"; -// // import { AUTH_STATUS, ToastTypes } from "~/enums"; -// import { useSignalEffect, useSignals } from "@preact/signals-react/runtime"; -// import { useNavigate, useSearchParams, BrowserRouter } from "react-router-dom"; -// import { createRoot } from "react-dom/client"; - -// // import "./styles/normalize.css"; -// // import "./styles/tailwind.css"; -// // import "./styles/base.css"; - -// import "@fortawesome/fontawesome-svg-core/styles.css"; - -// import { config } from "@fortawesome/fontawesome-svg-core"; - -// config.autoAddCss = false; /* eslint-disable import/first */ -// // TODO MAKE THIS A SHARED COMPONENT ART CRAFT -// const regEx = -// /^(([^<>()[\].,;:\s@"]+(.[^<>()[\].,;:\s@"]+)*)|(".+"))@(([^<>()[\].,;:\s@"]+\.)+[^<>()[\].,;:\s@"]{2,})$/i; - -// // TODO(bt,2025-04-19): Make these configurable -// const ENV = { -// BASE_API: "https://api.storyteller.ai", -// GOOGLE_API: "https://studio.storyteller.ai", -// FUNNEL_API: "https://studio.storyteller.ai", -// CDN_API: "https://cdn-2.fakeyou.com", -// GRAVATAR_API: "https://studio.storyteller.ai", -// DEPLOY_PRIME_URL: "https://studio.storyteller.ai", -// }; - -// export default function SignUpScreen() { -// useSignals(); -// const navigate = useNavigate(); -// const formRef = useRef(null); -// const [usernameError, setUsernameError] = useState(""); -// const [emailError, setEmailError] = useState(""); -// const [passwordError, setPasswordError] = useState(""); -// const [passwordConfirmationError, setPasswordConfirmationError] = -// useState(""); -// const [searchParams] = useSearchParams(); -// const { status: authStatus } = authentication; - -// const handleOnSubmit = (ev: FormEvent) => { -// ev.preventDefault(); -// if (formRef.current) { -// const form = new FormData(formRef.current); -// const email = form.get("email")?.toString(); -// const password = form.get("password")?.toString(); -// const passwordConfirmation = form -// .get("password-confirmation") -// ?.toString(); -// const username = form.get("username")?.toString(); -// setUsernameError(""); -// if (!username || username.length < 6) { -// setUsernameError("Username must be at least 6 characters long"); -// } -// setEmailError(""); -// if (!email || !email.match(regEx)) { -// setEmailError("Email must be a valid email address"); -// } -// setPasswordError(""); -// if (!password || password.length < 8) { -// setPasswordError("Password must be at least 8 characters long"); -// } -// setPasswordConfirmationError(""); -// if (!passwordError && passwordConfirmation !== password) { -// setPasswordConfirmationError("Passwords do not match"); -// } - -// if ( -// !usernameError && -// !passwordError && -// !emailError && -// !passwordConfirmationError && -// signUp -// ) { -// signUp({ -// username: username!, -// email: email!, -// password: password!, -// passwordConfirmation: passwordConfirmation!, -// }).then((error) => { -// console.log("Error occured", error); -// if (error) { -// addToast(ToastTypes.ERROR, error); -// } -// }); -// } -// } -// }; // end handleOnSubmit - -// useSignalEffect(() => { -// const redirectPath = searchParams.get("redirect"); -// if (authStatus.value === AUTH_STATUS.LOGGED_IN) { -// navigate(redirectPath ? redirectPath : "/"); -// return; -// } -// if (authStatus.value === AUTH_STATUS.NO_ACCESS) { -// window.open("https://storyteller.ai/", "_self"); -// return; -// } -// }); - -// return ( -//
-//
-// ArtCraft Logo -//
-//
-//
-//

Sign up

-//
-// -// -// -// -// -//
-//
-//
-//
-//

Already have an account?

-// -// Log in -// -//
-//
-//
-//
-// ); -// } - -// // TODO: Replace environment variables from `root.tsx` -// createRoot(document.getElementById("root")!).render( -// <> -// -// - -// -// -// -// , -// ); diff --git a/frontend/apps/editor2d/tsconfig.app.json b/frontend/apps/editor2d/tsconfig.app.json index 031bec6b5d..f00b2e6c39 100644 --- a/frontend/apps/editor2d/tsconfig.app.json +++ b/frontend/apps/editor2d/tsconfig.app.json @@ -28,12 +28,6 @@ "src" ], "references": [ - { - "path": "../../libs/components/toaster/tsconfig.lib.json" - }, - { - "path": "../../libs/components/input/tsconfig.lib.json" - }, { "path": "../../libs/components/settings-modal/tsconfig.lib.json" }, @@ -45,6 +39,9 @@ }, { "path": "../../libs/components/demo-modal/tsconfig.lib.json" + }, + { + "path": "../../libs/api/tsconfig.lib.json" } ] } diff --git a/frontend/apps/editor2d/tsconfig.json b/frontend/apps/editor2d/tsconfig.json index 5f9e4230d8..6adc2076c2 100644 --- a/frontend/apps/editor2d/tsconfig.json +++ b/frontend/apps/editor2d/tsconfig.json @@ -1,12 +1,6 @@ { "files": [], "references": [ - { - "path": "../../libs/components/toaster" - }, - { - "path": "../../libs/components/input" - }, { "path": "../../libs/components/settings-modal" }, @@ -19,6 +13,9 @@ { "path": "../../libs/components/demo-modal" }, + { + "path": "../../libs/api" + }, { "path": "./tsconfig.app.json" }, diff --git a/frontend/libs/api/src/lib/CommentsApi.ts b/frontend/libs/api/src/lib/CommentsApi.ts index dd010312eb..97f6412b83 100644 --- a/frontend/libs/api/src/lib/CommentsApi.ts +++ b/frontend/libs/api/src/lib/CommentsApi.ts @@ -1,91 +1,91 @@ -import { ApiManager, ApiResponse } from "../apis/ApiManager"; +// import { ApiManager, ApiResponse } from "../apis/ApiManager"; -export class CommentsApi extends ApiManager { - public CreateComment({ - commentMarkdown, - entityToken, - entityType, - uuidIdempotencyToken, - }: { - commentMarkdown: string; - entityToken: string; - entityType: string; - uuidIdempotencyToken: string; - }): Promise> { - const endpoint = `${this.ApiTargets.BaseApi}/v1/comments/new`; +// export class CommentsApi extends ApiManager { +// public CreateComment({ +// commentMarkdown, +// entityToken, +// entityType, +// uuidIdempotencyToken, +// }: { +// commentMarkdown: string; +// entityToken: string; +// entityType: string; +// uuidIdempotencyToken: string; +// }): Promise> { +// const endpoint = `${this.ApiTargets.BaseApi}/v1/comments/new`; - const body = { - comment_markdown: commentMarkdown, - entity_token: entityToken, - entity_type: entityType, - uuid_idempotency_token: uuidIdempotencyToken, - }; +// const body = { +// comment_markdown: commentMarkdown, +// entity_token: entityToken, +// entity_type: entityType, +// uuid_idempotency_token: uuidIdempotencyToken, +// }; - return this.post< - { - comment_markdown: string; - entity_token: string; - entity_type: string; - uuid_idempotency_token: string; - }, - { - success?: boolean; - comment_token?: string; - BadInput?: string; - } - >({ endpoint, body }) - .then((response) => ({ - success: response.success ?? false, - data: response.comment_token, - errorMessage: response.BadInput, - })) - .catch((err) => { - return { success: false, errorMessage: err.message }; - }); - } +// return this.post< +// { +// comment_markdown: string; +// entity_token: string; +// entity_type: string; +// uuid_idempotency_token: string; +// }, +// { +// success?: boolean; +// comment_token?: string; +// BadInput?: string; +// } +// >({ endpoint, body }) +// .then((response) => ({ +// success: response.success ?? false, +// data: response.comment_token, +// errorMessage: response.BadInput, +// })) +// .catch((err) => { +// return { success: false, errorMessage: err.message }; +// }); +// } - public DeleteComment({ - commentToken, - }: { - commentToken: string; - }): Promise> { - const endpoint = `${this.ApiTargets.BaseApi}/v1/comments/delete/${commentToken}`; +// public DeleteComment({ +// commentToken, +// }: { +// commentToken: string; +// }): Promise> { +// const endpoint = `${this.ApiTargets.BaseApi}/v1/comments/delete/${commentToken}`; - return this.post< - { as_mod: boolean }, - { - success?: boolean; - BadInput?: string; - } - >({ endpoint, body: { as_mod: true } }) - .then((response) => ({ - success: response.success ?? false, - errorMessage: response.BadInput, - })) - .catch((err) => { - return { success: false, errorMessage: err.message }; - }); - } +// return this.post< +// { as_mod: boolean }, +// { +// success?: boolean; +// BadInput?: string; +// } +// >({ endpoint, body: { as_mod: true } }) +// .then((response) => ({ +// success: response.success ?? false, +// errorMessage: response.BadInput, +// })) +// .catch((err) => { +// return { success: false, errorMessage: err.message }; +// }); +// } - public ListCommentsByEntity({ - entityType, - entityToken, - }: { - entityType: string; - entityToken: string; - }): Promise> { - const endpoint = `${this.ApiTargets.BaseApi}/v1/comments/list/${entityType}/${entityToken}`; +// public ListCommentsByEntity({ +// entityType, +// entityToken, +// }: { +// entityType: string; +// entityToken: string; +// }): Promise> { +// const endpoint = `${this.ApiTargets.BaseApi}/v1/comments/list/${entityType}/${entityToken}`; - return this.get<{ - success: boolean; - comments: string[]; - }>({ endpoint }) - .then((response) => ({ - success: true, - data: response.comments, - })) - .catch((err) => { - return { success: false, errorMessage: err.message }; - }); - } -} +// return this.get<{ +// success: boolean; +// comments: string[]; +// }>({ endpoint }) +// .then((response) => ({ +// success: true, +// data: response.comments, +// })) +// .catch((err) => { +// return { success: false, errorMessage: err.message }; +// }); +// } +// } diff --git a/frontend/libs/api/src/lib/FeaturedItemsApi.ts b/frontend/libs/api/src/lib/FeaturedItemsApi.ts index 1af1f28310..795c97447f 100644 --- a/frontend/libs/api/src/lib/FeaturedItemsApi.ts +++ b/frontend/libs/api/src/lib/FeaturedItemsApi.ts @@ -1,96 +1,96 @@ -import { ApiManager, ApiResponse } from "../apis/ApiManager"; +// import { ApiManager, ApiResponse } from "../apis/ApiManager"; -export class FeaturedItemsApi extends ApiManager { - public CreateFeaturedItem({ - entityToken, - entityType, - }: { - entityToken: string; - entityType: string; - }): Promise> { - const endpoint = `${this.ApiTargets.BaseApi}/v1/featured_item/create`; +// export class FeaturedItemsApi extends ApiManager { +// public CreateFeaturedItem({ +// entityToken, +// entityType, +// }: { +// entityToken: string; +// entityType: string; +// }): Promise> { +// const endpoint = `${this.ApiTargets.BaseApi}/v1/featured_item/create`; - const body = { - entity_token: entityToken, - entity_type: entityType, - }; +// const body = { +// entity_token: entityToken, +// entity_type: entityType, +// }; - return this.post< - { - entity_token: string; - entity_type: string; - }, - { - success?: boolean; - BadInput?: string; - } - >({ endpoint, body }) - .then((response) => ({ - success: response.success ?? false, - errorMessage: response.BadInput, - })) - .catch((err) => { - return { success: false, errorMessage: err.message }; - }); - } +// return this.post< +// { +// entity_token: string; +// entity_type: string; +// }, +// { +// success?: boolean; +// BadInput?: string; +// } +// >({ endpoint, body }) +// .then((response) => ({ +// success: response.success ?? false, +// errorMessage: response.BadInput, +// })) +// .catch((err) => { +// return { success: false, errorMessage: err.message }; +// }); +// } - public DeleteFeaturedItem({ - entityToken, - entityType, - }: { - entityToken: string; - entityType: string; - }): Promise> { - const endpoint = `${this.ApiTargets.BaseApi}/v1/featured_item/delete`; +// public DeleteFeaturedItem({ +// entityToken, +// entityType, +// }: { +// entityToken: string; +// entityType: string; +// }): Promise> { +// const endpoint = `${this.ApiTargets.BaseApi}/v1/featured_item/delete`; - const body = { - entity_token: entityToken, - entity_type: entityType, - }; +// const body = { +// entity_token: entityToken, +// entity_type: entityType, +// }; - return this.delete< - { - entity_token: string; - entity_type: string; - }, - { - success?: boolean; - BadInput?: string; - } - >({ endpoint, body }) - .then((response) => ({ - success: response.success ?? false, - errorMessage: response.BadInput, - })) - .catch((err) => { - return { success: false, errorMessage: err.message }; - }); - } +// return this.delete< +// { +// entity_token: string; +// entity_type: string; +// }, +// { +// success?: boolean; +// BadInput?: string; +// } +// >({ endpoint, body }) +// .then((response) => ({ +// success: response.success ?? false, +// errorMessage: response.BadInput, +// })) +// .catch((err) => { +// return { success: false, errorMessage: err.message }; +// }); +// } - public CheckFeaturedItem({ - entityType, - entityToken, - }: { - entityType: string; - entityToken: string; - }): Promise> { - const endpoint = `${this.ApiTargets.BaseApi}/v1/featured_item/is_featured/${entityType}/${entityToken}`; +// public CheckFeaturedItem({ +// entityType, +// entityToken, +// }: { +// entityType: string; +// entityToken: string; +// }): Promise> { +// const endpoint = `${this.ApiTargets.BaseApi}/v1/featured_item/is_featured/${entityType}/${entityToken}`; - return this.post< - undefined, - { - success?: boolean; - is_featured?: boolean; - BadInput?: string; - } - >({ endpoint }) - .then((response) => ({ - success: response.success ?? false, - data: response.is_featured, - errorMessage: response.BadInput, - })) - .catch((err) => { - return { success: false, errorMessage: err.message }; - }); - } -} +// return this.post< +// undefined, +// { +// success?: boolean; +// is_featured?: boolean; +// BadInput?: string; +// } +// >({ endpoint }) +// .then((response) => ({ +// success: response.success ?? false, +// data: response.is_featured, +// errorMessage: response.BadInput, +// })) +// .catch((err) => { +// return { success: false, errorMessage: err.message }; +// }); +// } +// } diff --git a/frontend/libs/api/src/lib/ModerationApi.ts b/frontend/libs/api/src/lib/ModerationApi.ts index 8074ce11dd..fde77488a8 100644 --- a/frontend/libs/api/src/lib/ModerationApi.ts +++ b/frontend/libs/api/src/lib/ModerationApi.ts @@ -1,42 +1,42 @@ -import { ApiManager, ApiResponse } from "../apis/ApiManager"; +// import { ApiManager, ApiResponse } from "../apis/ApiManager"; -export class ModerationApi extends ApiManager { - public async UpdateFeatureFlagsByToken({ - usernameOrToken, - flags, - }: { - usernameOrToken: string; - flags: string[]; - }): Promise< - ApiResponse<{ - inference_job_token?: string; - inference_job_token_type?: string; - }> - > { - const endpoint = `${this.ApiTargets.BaseApi}/v1/moderation/user_feature_flags/${usernameOrToken}`; +// export class ModerationApi extends ApiManager { +// public async UpdateFeatureFlagsByToken({ +// usernameOrToken, +// flags, +// }: { +// usernameOrToken: string; +// flags: string[]; +// }): Promise< +// ApiResponse<{ +// inference_job_token?: string; +// inference_job_token_type?: string; +// }> +// > { +// const endpoint = `${this.ApiTargets.BaseApi}/v1/moderation/user_feature_flags/${usernameOrToken}`; - const body = { - action: { - AddFlags: { - flags, - }, - }, - }; +// const body = { +// action: { +// AddFlags: { +// flags, +// }, +// }, +// }; - return this.post< - { action: { AddFlags: { flags: string[] } } }, - { success?: boolean; BadInput?: string } - >({ - endpoint, - body: body, - }) - .then((response) => ({ - success: response.success ?? false, - errorMessage: response.BadInput, - })) - .catch((err) => ({ - success: false, - errorMessage: err.message, - })); - } -} +// return this.post< +// { action: { AddFlags: { flags: string[] } } }, +// { success?: boolean; BadInput?: string } +// >({ +// endpoint, +// body: body, +// }) +// .then((response) => ({ +// success: response.success ?? false, +// errorMessage: response.BadInput, +// })) +// .catch((err) => ({ +// success: false, +// errorMessage: err.message, +// })); +// } +// } diff --git a/frontend/libs/api/src/lib/UsersApi.ts b/frontend/libs/api/src/lib/UsersApi.ts index ffbcfefc58..6dc02d3a8b 100644 --- a/frontend/libs/api/src/lib/UsersApi.ts +++ b/frontend/libs/api/src/lib/UsersApi.ts @@ -62,6 +62,7 @@ export class UsersApi extends ApiManager { usernameOrEmail: string; password: string; }): Promise> { + console.log("Logging in with usernameOrEmail:", usernameOrEmail); const endpoint = `${this.ApiTargets.BaseApi}/v1/login`; const body = { username_or_email: usernameOrEmail, diff --git a/package.json b/package.json new file mode 100644 index 0000000000..ec8da1f378 --- /dev/null +++ b/package.json @@ -0,0 +1,5 @@ +{ + "devDependencies": { + "@tauri-apps/cli": "^2.5.0" + } +}