mirror of
https://github.com/upscayl/upscayl.git
synced 2024-11-30 18:24:27 +01:00
Add reset and hide modal
This commit is contained in:
parent
eb1e467a67
commit
b4ebfdf871
@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "upscayl",
|
||||
"private": true,
|
||||
"version": "2.7.5",
|
||||
"version": "2.8.0",
|
||||
"productName": "Upscayl",
|
||||
"homepage": "https://github.com/TGS963/upscayl",
|
||||
"contributors": [
|
||||
@ -56,7 +56,6 @@
|
||||
"appId": "org.upscayl.app",
|
||||
"artifactName": "${name}-${version}-${os}-${arch}.${ext}",
|
||||
"asar": true,
|
||||
"notarize": false,
|
||||
"afterSign": "scripts/notarize.js",
|
||||
"extraFiles": [
|
||||
{
|
||||
@ -97,6 +96,7 @@
|
||||
"hardenedRuntime": true,
|
||||
"entitlements": "resources/entitlements.mac.plist",
|
||||
"entitlementsInherit": "resources/entitlements.mac.plist",
|
||||
"notarize": false,
|
||||
"gatekeeperAssess": false,
|
||||
"target": [
|
||||
{
|
||||
|
@ -13,3 +13,8 @@ export const rememberOutputFolderAtom = atomWithStorage<boolean>(
|
||||
"rememberOutputFolder",
|
||||
false
|
||||
);
|
||||
|
||||
export const dontShowCloudModalAtom = atomWithStorage<boolean>(
|
||||
"dontShowCloudModal",
|
||||
false
|
||||
);
|
||||
|
@ -6,7 +6,8 @@ export default function Header({ version }: { version: string }) {
|
||||
href="https://github.com/upscayl/upscayl"
|
||||
target="_blank"
|
||||
className={`outline-none focus-visible:ring-2`}
|
||||
data-tip="Star us on GitHub 😁">
|
||||
data-tooltip-id="tooltip"
|
||||
data-tooltip-content="Star us on GitHub 😁">
|
||||
<div className="flex items-center gap-3 px-5 py-5">
|
||||
<img src="icon.png" className="inline-block w-14" alt="Upscayl Logo" />
|
||||
<div className="flex flex-col justify-center">
|
||||
|
@ -5,13 +5,38 @@ import { doc, setDoc } from "firebase/firestore";
|
||||
const nameRegex = /^[A-Za-z\s.'-]+$/;
|
||||
const emailRegex = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
|
||||
|
||||
export const UpscaylCloudModal = ({ show, setShow }) => {
|
||||
export const UpscaylCloudModal = ({ show, setShow, setDontShowCloudModal }) => {
|
||||
const [name, setName] = useState("");
|
||||
const [email, setEmail] = useState("");
|
||||
|
||||
return (
|
||||
<dialog className={`modal ${show && "modal-open"}`}>
|
||||
<div className="modal-box flex flex-col text-center items-center gap-4">
|
||||
<button
|
||||
className="absolute top-2 right-4 btn btn-circle"
|
||||
onClick={() => setShow(false)}>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
width="24"
|
||||
height="24"
|
||||
viewBox="0 0 24 24">
|
||||
<rect
|
||||
x="0"
|
||||
y="0"
|
||||
width="24"
|
||||
height="24"
|
||||
fill="none"
|
||||
stroke="none"
|
||||
/>
|
||||
<path
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-linecap="round"
|
||||
stroke-width="1.5"
|
||||
d="m8.464 15.535l7.072-7.07m-7.072 0l7.072 7.07"
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
<p className="badge badge-neutral text-xs">Coming soon!</p>
|
||||
<p className="text-2xl font-semibold">Introducing Upscayl Cloud!</p>
|
||||
<p className="w-9/12 font-medium text-lg">
|
||||
@ -46,11 +71,15 @@ export const UpscaylCloudModal = ({ show, setShow }) => {
|
||||
email,
|
||||
});
|
||||
} catch (error) {
|
||||
alert("Error joining the waitlist. Please try again...");
|
||||
alert(
|
||||
`Thank you ${name}! It seems that your email has already been registered :D If that's not the case, please try again.`
|
||||
);
|
||||
return;
|
||||
}
|
||||
setName("");
|
||||
setEmail("");
|
||||
setDontShowCloudModal(true);
|
||||
setShow(false);
|
||||
alert(
|
||||
"Thank you for joining the waitlist! We will notify you when Upscayl Cloud is ready for you."
|
||||
);
|
||||
@ -79,6 +108,16 @@ export const UpscaylCloudModal = ({ show, setShow }) => {
|
||||
className="bg-success text-success-content rounded-2xl px-4 py-2">
|
||||
Join the waitlist
|
||||
</button>
|
||||
|
||||
<button
|
||||
className="text-xs text-base-content/50"
|
||||
onClick={() => {
|
||||
setDontShowCloudModal(true);
|
||||
setShow(false);
|
||||
}}
|
||||
type="button">
|
||||
DON'T SHOW AGAIN
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
|
20
renderer/components/settings-tab/ResetSettings.tsx
Normal file
20
renderer/components/settings-tab/ResetSettings.tsx
Normal file
@ -0,0 +1,20 @@
|
||||
import React from "react";
|
||||
import commands from "../../../electron/commands";
|
||||
|
||||
export function ResetSettings() {
|
||||
return (
|
||||
<div className="flex flex-col items-start gap-2">
|
||||
<p className="text-sm font-medium">RESET UPSCAYL</p>
|
||||
<button
|
||||
className="btn-primary btn"
|
||||
onClick={async () => {
|
||||
localStorage.clear();
|
||||
alert(
|
||||
"Upscayl has been reset. Please close this window and open Upscayl again."
|
||||
);
|
||||
}}>
|
||||
RESET UPSCAYL
|
||||
</button>
|
||||
</div>
|
||||
);
|
||||
}
|
@ -14,6 +14,8 @@ import { modelsListAtom } from "../../atoms/modelsListAtom";
|
||||
import useLog from "../hooks/useLog";
|
||||
import { QualityInput } from "./QualityInput";
|
||||
import ToggleOverwrite from "./ToggleOverwrite";
|
||||
import { UpscaylCloudModal } from "../UpscaylCloudModal";
|
||||
import { ResetSettings } from "./ResetSettings";
|
||||
|
||||
interface IProps {
|
||||
batchMode: boolean;
|
||||
@ -28,6 +30,9 @@ interface IProps {
|
||||
overwrite: boolean;
|
||||
setOverwrite: (arg: any) => void;
|
||||
os: "linux" | "mac" | "win" | undefined;
|
||||
show: boolean;
|
||||
setShow: React.Dispatch<React.SetStateAction<boolean>>;
|
||||
setDontShowCloudModal: React.Dispatch<React.SetStateAction<boolean>>;
|
||||
}
|
||||
|
||||
function SettingsTab({
|
||||
@ -43,6 +48,9 @@ function SettingsTab({
|
||||
overwrite,
|
||||
setOverwrite,
|
||||
os,
|
||||
show,
|
||||
setShow,
|
||||
setDontShowCloudModal,
|
||||
}: IProps) {
|
||||
// STATES
|
||||
const [currentModel, setCurrentModel] = useState<{
|
||||
@ -195,6 +203,23 @@ function SettingsTab({
|
||||
customModelsPath={customModelsPath}
|
||||
setCustomModelsPath={setCustomModelsPath}
|
||||
/>
|
||||
|
||||
{/* RESET SETTINGS */}
|
||||
<ResetSettings />
|
||||
|
||||
<button
|
||||
className="mb-5 rounded-btn p-1 mx-5 bg-success shadow-lg shadow-success/40 text-slate-50 animate-pulse text-sm"
|
||||
onClick={() => {
|
||||
setShow(true);
|
||||
}}>
|
||||
Introducing Upscayl Cloud
|
||||
</button>
|
||||
|
||||
<UpscaylCloudModal
|
||||
show={show}
|
||||
setShow={setShow}
|
||||
setDontShowCloudModal={setDontShowCloudModal}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
@ -1,4 +1,4 @@
|
||||
"use client"
|
||||
"use client";
|
||||
import { useState, useEffect, useCallback } from "react";
|
||||
import commands from "../../electron/commands";
|
||||
import { ReactCompareSlider } from "react-compare-slider";
|
||||
@ -13,7 +13,11 @@ import SettingsTab from "../components/settings-tab";
|
||||
import { useAtom } from "jotai";
|
||||
import { logAtom } from "../atoms/logAtom";
|
||||
import { modelsListAtom } from "../atoms/modelsListAtom";
|
||||
import { batchModeAtom, scaleAtom } from "../atoms/userSettingsAtom";
|
||||
import {
|
||||
batchModeAtom,
|
||||
dontShowCloudModalAtom,
|
||||
scaleAtom,
|
||||
} from "../atoms/userSettingsAtom";
|
||||
import useLog from "../components/hooks/useLog";
|
||||
import { UpscaylCloudModal } from "../components/UpscaylCloudModal";
|
||||
|
||||
@ -47,6 +51,9 @@ const Home = () => {
|
||||
const [logData, setLogData] = useAtom(logAtom);
|
||||
const [modelOptions, setModelOptions] = useAtom(modelsListAtom);
|
||||
const [scale] = useAtom(scaleAtom);
|
||||
const [dontShowCloudModal, setDontShowCloudModal] = useAtom(
|
||||
dontShowCloudModalAtom
|
||||
);
|
||||
|
||||
const [showCloudModal, setShowCloudModal] = useState(false);
|
||||
|
||||
@ -458,12 +465,17 @@ const Home = () => {
|
||||
return (
|
||||
<div className="flex h-screen w-screen flex-row overflow-hidden bg-base-300">
|
||||
<div className={`flex h-screen w-128 flex-col bg-base-100`}>
|
||||
<UpscaylCloudModal show={showCloudModal} setShow={setShowCloudModal} />
|
||||
<UpscaylCloudModal
|
||||
show={showCloudModal}
|
||||
setShow={setShowCloudModal}
|
||||
setDontShowCloudModal={setDontShowCloudModal}
|
||||
/>
|
||||
{window.electron.platform === "mac" && (
|
||||
<div className="pt-8 mac-titlebar"></div>
|
||||
)}
|
||||
{/* HEADER */}
|
||||
<Header version={version} />
|
||||
{!dontShowCloudModal && (
|
||||
<button
|
||||
className="mb-5 rounded-btn p-1 mx-5 bg-success shadow-lg shadow-success/40 text-slate-50 animate-pulse text-sm"
|
||||
onClick={() => {
|
||||
@ -471,6 +483,7 @@ const Home = () => {
|
||||
}}>
|
||||
Introducing Upscayl Cloud
|
||||
</button>
|
||||
)}
|
||||
|
||||
<Tabs selectedTab={selectedTab} setSelectedTab={setSelectedTab} />
|
||||
|
||||
@ -509,6 +522,9 @@ const Home = () => {
|
||||
overwrite={overwrite}
|
||||
setOverwrite={setOverwrite}
|
||||
os={os}
|
||||
show={showCloudModal}
|
||||
setShow={setShowCloudModal}
|
||||
setDontShowCloudModal={setDontShowCloudModal}
|
||||
/>
|
||||
)}
|
||||
{/* )} */}
|
||||
|
Loading…
Reference in New Issue
Block a user