fixed create organization modal issue with scroll

src/components/Authentication/VerifyEmail.tsx

@@ -6,7 +6,7 @@ import type { AxiosResponse } from 'axios';
 import { HiOutlineMail } from "react-icons/hi";
 import { apiStatusCodes } from '../../config/CommonConstant';
 
-const VarifyEmail = () => {
+const VerifyEmail = () => {
  const [loading, setLoading] = useState<boolean>(true)
  const [message, setMessage] = useState<string>('')
  const [error, setError] = useState<boolean>(false)
@@ -71,4 +71,4 @@ const VarifyEmail = () => {
  )
 }
 
-export default VarifyEmail
+export default VerifyEmail

src/components/organization/CreateOrgFormModal.tsx

@@ -4,7 +4,7 @@ import { Avatar, Button, Label, Modal } from 'flowbite-react';
 import { Field, Form, Formik, FormikHelpers } from 'formik';
 import { IMG_MAX_HEIGHT, IMG_MAX_WIDTH, apiStatusCodes, imageSizeAccepted } from '../../config/CommonConstant'
 import { calculateSize, dataURItoBlob } from "../../utils/CompressImage";
-import { useRef, useState } from "react";
+import { useRef, useState, useEffect } from "react";
 
 import type { AxiosResponse } from 'axios';
 import { asset } from '../../lib/data.js';
@@ -40,6 +40,17 @@ const CreateOrgFormModal = (props: { openModal: boolean; setOpenModal: (flag: bo
 
  const [imgError, setImgError] = useState('')
 
+ useEffect(()=>{
+ setOrgData({
+ name: '',
+ description: '',
+ })
+ setLogoImage({
+ logoFile: "",
+ imagePreviewUrl: ""
+ })
+ },[props.openModal])
+
 
  const ProcessImg = (e: any): string | undefined => {
 
@@ -141,7 +152,7 @@ const CreateOrgFormModal = (props: { openModal: boolean; setOpenModal: (flag: bo
  }
 
  return (
- <Modal show={props.openModal === true} onClose={() => {
+ <Modal show={props.openModal} onClose={() => {
  setLogoImage({
  logoFile: "",
  imagePreviewUrl: ""

src/components/organization/OrganizationsList.tsx

@@ -126,15 +126,11 @@ const OrganizationsList = () => {
  </Button>
  </div>
 
- {
- props.openModal &&
- <CreateOrgFormModal
+ <CreateOrgFormModal
  openModal={props.openModal}
  setOpenModal={
  props.setOpenModal
  } />
- }
-
  {loading
  ? <div className="flex items-center justify-center mb-4">
  <Spinner

src/components/organization/Users.tsx

@@ -0,0 +1,58 @@
+'use client';
+
+import { Button, Card, Pagination, Spinner } from 'flowbite-react';
+import { ChangeEvent, useEffect, useState } from 'react';
+
+import type { AxiosResponse } from 'axios';
+import BreadCrumbs from '../BreadCrumbs';
+import CreateOrgFormModal from "./CreateOrgFormModal";
+import CustomAvatar from '../Avatar'
+import type { Organisation } from './interfaces'
+import SearchInput from '../SearchInput';
+
+const Users = () => {
+ const [openModal, setOpenModal] = useState<boolean>(false);
+ const [loading, setLoading] = useState<boolean>(true)
+ const [message, setMessage] = useState<string>('')
+
+
+ const [searchText, setSearchText] = useState("");
+ const props = { openModal, setOpenModal };
+
+
+
+ //onCHnage of Search input text
+ const searchInputChange = (e: ChangeEvent<HTMLInputElement>) => {
+ setSearchText(e.target.value);
+ }
+
+
+ return (
+ <div className="px-4 pt-6">
+ <div className="mb-4 col-span-full xl:mb-2">
+
+ <BreadCrumbs />
+ <h1 className="ml-1 text-xl font-semibold text-gray-900 sm:text-2xl dark:text-white">
+ Users
+ </h1>
+ </div>
+ <div>
+ <div className="p-4 bg-white border border-gray-200 rounded-lg shadow-sm 2xl:col-span-2 dark:border-gray-700 sm:p-6 dark:bg-gray-800">
+ <div className="flex items-center justify-between mb-4">
+ <SearchInput
+ onInputChange={searchInputChange}
+ />
+ <Button
+ color='bg-primary-800'
+ className='text-base font-medium text-center text-white bg-primary-700 rounded-lg hover:bg-primary-800 focus:ring-4 focus:ring-primary-300 sm:w-auto dark:bg-primary-600 dark:hover:bg-primary-700 dark:focus:ring-primary-800"'
+ >
+ Invite
+ </Button>
+ </div>
+ </div>
+ </div>
+ </div>
+ )
+}
+
+export default Users;

src/pages/organizations/users.astro

@@ -0,0 +1,8 @@
+---
+import LayoutSidebar from '../../app/LayoutSidebar.astro';
+import Users from '../../components/organization/Users';
+---
+
+<LayoutSidebar>
+ <Users client:load/>
+</LayoutSidebar>

src/pages/verify-email-success.astro

@@ -1,8 +1,8 @@
 ---
 import LayoutStacked from '../app/LayoutStacked.astro';
-import VarifyEmail from '../components/Authentication/VerifyEmail';
+import VerifyEmail from '../components/Authentication/VerifyEmail';
 ---
 
 <LayoutStacked>
- <VarifyEmail client:load/>
+ <VerifyEmail client:load/>
 </LayoutStacked>