BhawanSingh
/
SME-Web
2
0
Fork 0
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity

Compare commits

base: BhawanSingh:19733eb22ae0638edf33305202bf47165c9aa119
Branches Tags
BhawanSingh:master
BhawanSingh:fontAdded
BhawanSingh:main
BhawanSingh:remove_ps1
BhawanSingh:jai
BhawanSingh:bhagwan
BhawanSingh:bhagwanSingh
..
compare: BhawanSingh:13b506960bb86f27add7d64dcdc57c64c2d19657
Branches Tags
BhawanSingh:fontAdded
BhawanSingh:main
BhawanSingh:remove_ps1
BhawanSingh:jai
BhawanSingh:bhagwan
BhawanSingh:master
BhawanSingh:bhagwanSingh

No commits in common. "19733eb22ae0638edf33305202bf47165c9aa119" and "13b506960bb86f27add7d64dcdc57c64c2d19657" have entirely different histories.
19733eb22a ... 13b506960b

3 changed files with 78 additions and 140 deletions
Show Stats Expand all files Collapse all files

8
src/components/auth/UsertAuthUI.tsx
View File

@ -3,6 +3,9 @@ import { useEffect, useState } from "react";
import { useNavigate, useLocation } from "react-router-dom"; import { useNavigate, useLocation } from "react-router-dom";
import LoginForm from "./LoginForm"; import LoginForm from "./LoginForm";
import RegisterForm from "./RegisterForm"; import RegisterForm from "./RegisterForm";
import { useDispatch } from "react-redux";
import { AppDispatch } from "../../store/store";
import { fetchUserDetails } from "../../store/slices/userSlice";
import LoginRegisterImg from "../../assets/illustration_1_.png"; import LoginRegisterImg from "../../assets/illustration_1_.png";
import SMELogo from "../../assets/SMELogo.png"; import SMELogo from "../../assets/SMELogo.png";
import api from "../../config/api"; import api from "../../config/api";
@ -72,10 +75,7 @@ function UserAuthUI() {
</div> </div>
{/* Right Side - Form */} {/* Right Side - Form */}
<div className="flex-1 flex-col sm:flex items-center justify-center p-8 lg:p-12"> <div className="flex-1 flex items-center justify-center p-8 lg:p-12">
<div className="h-[82px] sm:hidden w-full flex justify-center items-center p-4 bg-[var(--primary)] rounded-lg">
<img loading="lazy" height={50} src={SMELogo} alt="" />
</div>
{pageType === PAGE_TYPE_ENUM.LOGIN && <LoginForm onSwitchToRegister={() => navigate("/register")} />} {pageType === PAGE_TYPE_ENUM.LOGIN && <LoginForm onSwitchToRegister={() => navigate("/register")} />}
{pageType === PAGE_TYPE_ENUM.REGISTER && <RegisterForm onSwitchToLogin={() => navigate("/login")} />} {pageType === PAGE_TYPE_ENUM.REGISTER && <RegisterForm onSwitchToLogin={() => navigate("/login")} />}
{pageType === PAGE_TYPE_ENUM.FORGOT_PASSWORD && <ForgotPasswordForm />} {pageType === PAGE_TYPE_ENUM.FORGOT_PASSWORD && <ForgotPasswordForm />}

171
src/components/process/processStepTwo/tagProperties/TagProperties.tsx
View File

@ -143,21 +143,6 @@ const TagProperties: React.FC<DroppedItemProps> = (
setDropDownToggle(null) setDropDownToggle(null)
} }
{/* Font */ }
const smeFonts = [
"Arial",
"Helvetica",
"Times New Roman",
"Georgia",
"Verdana",
"Tahoma",
"Trebuchet MS",
"Courier New",
"Lucida Console",
"Impact",
];
// useEffect(() => { // useEffect(() => {
// if (selectedTag.label == "temporal" && !("dateFormat" in selectedTag)) { // if (selectedTag.label == "temporal" && !("dateFormat" in selectedTag)) {
// handlePropertyChange("dateFormat", TEMPORAL.DATE); // handlePropertyChange("dateFormat", TEMPORAL.DATE);
@ -375,11 +360,7 @@ const TagProperties: React.FC<DroppedItemProps> = (
{ {
selectedTag.type.toLowerCase() == TagsTypes.TEMPORAL && selectedTag.type.toLowerCase() == TagsTypes.TEMPORAL &&
<CurrTimeStampAttr <CurrTimeStampAttr type={selectedTag.type} handlePropertyChange={handlePropertyChange} />
type={selectedTag.type}
currentTimeStamp={selectedTag.currentTimeStamp ?? false}
handlePropertyChange={handlePropertyChange}
/>
} }
<LabelAttr label={selectedTag.label ?? ""} handlePropertyChange={handlePropertyChange} /> <LabelAttr label={selectedTag.label ?? ""} handlePropertyChange={handlePropertyChange} />
@ -470,104 +451,66 @@ const TagProperties: React.FC<DroppedItemProps> = (
className="block mb-2 font-medium">Styles</label> className="block mb-2 font-medium">Styles</label>
<IoIosArrowDown className={`${styleOpen ? "rotate-[-90deg]" : ""} transition-all`} /> <IoIosArrowDown className={`${styleOpen ? "rotate-[-90deg]" : ""} transition-all`} />
</div> </div>
{styleOpen && ( {
<div className="rounded-sm border border-slate-200 bg-white p-4 shadow-sm"> styleOpen && <>
<div className="flex flex-wrap items-center gap-3"> {/* Font */}
{/* Font */} <div className="mb-2">
<div className="flex flex-col min-w-[140px] flex-1"> <label className="mr-2">Font</label>
<label className="text-xs font-medium text-slate-500 mb-1"> <input
Font type="text"
</label> placeholder="e.g. Arial"
<select className="outline-none border-1 rounded px-2 py-1 border-slate-200"
className="h-10 rounded-sm border border-slate-300 px-3 text-sm focus:outline-none focus:ring-2 focus:ring-blue-500" value={styles.font}
value={styles.font} onChange={(e) => handleStyleChange("font", e.target.value)}
onChange={(e) => handleStyleChange("font", e.target.value)} />
>
{smeFonts.map((font) => (
<option key={font} value={font}>
{font}
</option>
))}
</select>
</div>
{/* Font Size */}
<div className="flex flex-col w-24">
<label className="text-xs font-medium text-slate-500 mb-1">
Size
</label>
<select
className="h-10 rounded-sm border border-slate-300 px-2 text-sm focus:outline-none focus:ring-2 focus:ring-blue-500"
value={styles.textSize}
onChange={(e) =>
handleStyleChange("textSize", Number(e.target.value))
}
>
{[7, 8, 9, 10, 11, 12, 14, 16, 18, 20, 22, 24, 26, 28, 36, 38, 72].map(
(size) => (
<option key={size} value={size}>
{size}
</option>
)
)}
</select>
</div>
{/* Color */}
<div className="flex flex-col">
<label className="text-xs font-medium text-slate-500 mb-1">
Color
</label>
<input
type="color"
className="h-10 w-14 cursor-pointer rounded-sm border border-slate-300 bg-white"
value={styles.color}
onChange={(e) =>
handleStyleChange("color", e.target.value)
}
/>
</div>
</div> </div>
{/* Style Buttons */} {/* Text Size */}
<div className="mt-4 flex flex-wrap gap-2"> <div className="mb-2">
<button <label className="mr-2">Text Size</label>
type="button" <input
onClick={() => handleStyleChange("bold", !styles.bold)} // value={}
className={`h-10 w-10 rounded-sm border transition ${styles.bold type="number"
? "bg-blue-600 text-white border-blue-600" className="outline-none border-1 rounded px-2 py-1 border-slate-200"
: "bg-white border-slate-300 hover:bg-slate-100" value={styles.textSize}
}`} onChange={(e) =>
> handleStyleChange("textSize", parseInt(e.target.value, 10) || 0)
<strong>B</strong>
</button>
<button
type="button"
onClick={() => handleStyleChange("italic", !styles.italic)}
className={`h-10 w-10 rounded-sm border transition ${styles.italic
? "bg-blue-600 text-white border-blue-600"
: "bg-white border-slate-300 hover:bg-slate-100"
}`}
>
<em>I</em>
</button>
<button
type="button"
onClick={() =>
handleStyleChange("underline", !styles.underline)
} }
className={`h-10 w-10 rounded-sm border transition ${styles.underline />
? "bg-blue-600 text-white border-blue-600"
: "bg-white border-slate-300 hover:bg-slate-100"
}`}
>
<span className="underline">U</span>
</button>
</div> </div>
</div>
)} {/* Color */}
<div className="mb-2">
<label className="mr-2">Color</label>
<input
type="color"
className="outline-none border-1 rounded px-2 py-1 border-slate-200 w-10 h-8"
value={styles.color}
onChange={(e) => handleStyleChange("color", e.target.value)}
/>
</div>
{/* Toggles for Bold, Italic, Underline */}
<div className="flex gap-4 items-center mt-2">
<label className="flex gap-1 items-center">
<input type="checkbox" checked={styles.bold}
onChange={(e) => handleStyleChange("bold", e.target.checked)} />
Bold
</label>
<label className="flex gap-1 items-center">
<input type="checkbox" checked={styles.italic} onChange={(e) => handleStyleChange("italic", e.target.checked)} />
Italic
</label>
<label className="flex gap-1 items-center">
<input type="checkbox" checked={styles.underline}
onChange={(e) =>
handleStyleChange("underline", e.target.checked)
} />
Underline
</label>
</div>
</>
}
</div> </div>
} }

39
src/components/process/processStepTwo/tagProperties/attributes/CurrTimeStampAttr.tsx
View File

@ -1,42 +1,37 @@
import React, { useState } from 'react'
interface CurrTimeStampAttrInt { interface CurrTimeStampAttrInt {
type: string; type: string;
currentTimeStamp?: boolean; handlePropertyChange: (changeTo: string, changeWith: string | boolean | number) => void;
handlePropertyChange: (
changeTo: string,
changeWith: string | boolean | number
) => void;
} }
const CurrTimeStampAttr: React.FC<CurrTimeStampAttrInt> = ({ const CurrTimeStampAttr: React.FC<CurrTimeStampAttrInt> = ({ type, handlePropertyChange}) => {
type,
currentTimeStamp = false, const [isCurrentTimeStamp, setIsCurrentTimeStamp] = useState<boolean>(true);
handlePropertyChange,
}) => {
const handleIsCurrentTimeStamp = (checked: boolean) => { const handleIsCurrentTimeStamp = (checked: boolean) => {
if (type.toLowerCase() === "temporal") { if (type.toLowerCase() == "temporal") {
setIsCurrentTimeStamp(checked)
handlePropertyChange("currentTimeStamp", checked); handlePropertyChange("currentTimeStamp", checked);
} }
}; }
return ( return (
<div className="flex justify-between items-center border p-1.5 rounded-sm border-slate-200"> <div className="flex justify-between items-center border-1 p-1.5 rounded-sm border-slate-200">
<label <label
className="text-slate-600 font-medium" className="text-slate-600 transitions-all duration-150 font-medium"
htmlFor="use_current_timestamp" htmlFor="use_current_timestamp"
> >
Use Current Timestamp Use Current Timestamp
</label> </label>
<input <input
checked={isCurrentTimeStamp ? isCurrentTimeStamp : false}
onChange={(e) => handleIsCurrentTimeStamp(e.target.checked)}
id="use_current_timestamp" id="use_current_timestamp"
type="checkbox" type="checkbox"
checked={currentTimeStamp}
onChange={(e) =>
handleIsCurrentTimeStamp(e.target.checked)
}
/> />
</div> </div>
); )
}; }
export default CurrTimeStampAttr; export default CurrTimeStampAttr