Fix animations
This commit is contained in:
@@ -22,6 +22,7 @@ import { RiThumbUpLine } from "react-icons/ri";
|
||||
import { ToastContainer } from "react-toastify";
|
||||
|
||||
import approvalWorkflowsData from '../../demo/approval_workflows.json'; // to test locally
|
||||
import Tip from "@/components/ApprovalWorkflows/Tip";
|
||||
|
||||
export const getServerSideProps = withIronSessionSsr(async ({ req, res, params }) => {
|
||||
const user = await requestUser(req, res);
|
||||
@@ -125,6 +126,9 @@ export default function Home({ user, workflow, workflowAssignees, workflowReques
|
||||
status={workflow.status}
|
||||
/>
|
||||
</div>
|
||||
{steps.find((step) => !step.completed) === undefined &&
|
||||
<Tip text="All steps in this instance have been completed." />
|
||||
}
|
||||
</section>
|
||||
|
||||
<section className="flex flex-col gap-0">
|
||||
@@ -235,7 +239,7 @@ export default function Home({ user, workflow, workflowAssignees, workflowReques
|
||||
value={comments}
|
||||
onChange={(e) => setComments(e.target.value)}
|
||||
placeholder="Input comments here"
|
||||
className="w-full h-80 p-2 border-2 rounded-xl focus:border-mti-purple focus:outline-none mt-4"
|
||||
className="w-full h-80 p-2 border-2 rounded-xl shadow-lg focus:border-mti-purple focus:outline-none mt-4"
|
||||
/>
|
||||
<button onClick={saveComments} className="mt-4 px-6 py-2 bg-mti-purple-dark text-white rounded-full">
|
||||
Save Comments
|
||||
|
||||
@@ -13,7 +13,7 @@ import { requestUser } from "@/utils/api";
|
||||
import { getEntities } from "@/utils/entities.be";
|
||||
import { shouldRedirectHome } from "@/utils/navigation.disabled";
|
||||
import { getEntitiesUsers } from "@/utils/users.be";
|
||||
import { LayoutGroup, motion } from "framer-motion";
|
||||
import { AnimatePresence, LayoutGroup, motion } from "framer-motion";
|
||||
import { withIronSessionSsr } from "iron-session/next";
|
||||
import Head from "next/head";
|
||||
import Link from "next/link";
|
||||
@@ -251,34 +251,27 @@ export default function Home({ user, userEntitiesWithLabel, userEntitiesTeachers
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
<LayoutGroup>
|
||||
{(!currentWorkflow.name || !currentWorkflow.entityId) && (
|
||||
<AnimatePresence mode="wait">
|
||||
<LayoutGroup key={currentWorkflow.id}>
|
||||
<motion.div
|
||||
key={0}
|
||||
initial={{ opacity: 0, y: -20 }}
|
||||
key="form"
|
||||
initial={{ opacity: 0, y: -30 }}
|
||||
animate={{ opacity: 1, y: 0 }}
|
||||
exit={{ opacity: 0, y: -20 }}
|
||||
transition={{ duration: 0.3 }}
|
||||
exit={{ opacity: 0, x: 60 }}
|
||||
transition={{ duration: 0.20 }}
|
||||
>
|
||||
<Tip text="Please fill in workflow name and associated entity to start configuring workflow." />
|
||||
{(!currentWorkflow.name || !currentWorkflow.entityId) && (
|
||||
<Tip text="Please fill in workflow name and associated entity to start configuring workflow." />
|
||||
)}
|
||||
<WorkflowForm
|
||||
workflow={currentWorkflow}
|
||||
onWorkflowChange={onWorkflowChange}
|
||||
entityTeachers={entityTeachers}
|
||||
entityCorporates={entityCorporates}
|
||||
/>
|
||||
</motion.div>
|
||||
)}
|
||||
|
||||
<motion.div
|
||||
key={1}
|
||||
initial={{ opacity: 0, y: -20 }}
|
||||
animate={{ opacity: 1, y: 0 }}
|
||||
exit={{ opacity: 0, y: -20 }}
|
||||
transition={{ duration: 0.3 }}
|
||||
>
|
||||
<WorkflowForm
|
||||
workflow={currentWorkflow}
|
||||
onWorkflowChange={onWorkflowChange}
|
||||
entityTeachers={entityTeachers}
|
||||
entityCorporates={entityCorporates}
|
||||
/>
|
||||
</motion.div>
|
||||
</LayoutGroup>
|
||||
</LayoutGroup>
|
||||
</AnimatePresence>
|
||||
</>
|
||||
)}
|
||||
</form>
|
||||
|
||||
Reference in New Issue
Block a user