implemented changes to show parent of the suborg
This commit is contained in:
Hari Krishna
+267
-114
@@ -163,6 +163,7 @@ const Admin = (props) => {
|
||||
const [curTab, setCurTab] = React.useState(0);
|
||||
const [users, setUsers] = React.useState([]);
|
||||
const [subOrgs, setSubOrgs] = useState([]);
|
||||
const [parentOrg, setParentOrg] = React.useState(null);
|
||||
const [organizations, setOrganizations] = React.useState([]);
|
||||
const [orgSyncResponse, setOrgSyncResponse] = React.useState("");
|
||||
const [userSettings, setUserSettings] = React.useState({});
|
||||
@@ -1111,40 +1112,41 @@ If you're interested, please let me know a time that works for you, or set up a
|
||||
toast("Error getting current organization");
|
||||
});
|
||||
};
|
||||
const handleGetSubOrgs = (orgId) => {
|
||||
|
||||
if (serverside !== true && window.location.search !== undefined && window.location.search !== null) {
|
||||
const urlSearchParams = new URLSearchParams(window.location.search);
|
||||
const params = Object.fromEntries(urlSearchParams.entries());
|
||||
const foundorgid = params["org_id"];
|
||||
if (foundorgid !== undefined && foundorgid !== null) {
|
||||
orgId = foundorgid;
|
||||
}
|
||||
}
|
||||
|
||||
if (orgId.length === 0) {
|
||||
toast("Organization ID not defined. Please contact us on https://shuffler.io if this persists logout.");
|
||||
return;
|
||||
}
|
||||
const handleGetSubOrgs = (orgId) => {
|
||||
|
||||
fetch(`${globalUrl}/api/v1/subOrgs/${orgId}`, {
|
||||
method: "GET",
|
||||
credentials: "include",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
})
|
||||
if (orgId.length === 0) {
|
||||
toast("Organization ID not defined. Please contact us on https://shuffler.io if this persists logout.");
|
||||
return;
|
||||
}
|
||||
|
||||
fetch(`${globalUrl}/api/v1/sub_orgs/${orgId}`, {
|
||||
method: "GET",
|
||||
credentials: "include",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
})
|
||||
.then((response) => {
|
||||
if (!response.ok) {
|
||||
throw new Error('Failed to fetch sub organizations');
|
||||
}
|
||||
return response.json();
|
||||
})
|
||||
.then((responseJson) => {
|
||||
setSubOrgs(responseJson);
|
||||
if (responseJson.success === false) {
|
||||
toast("Failed getting your org. If this persists, please contact support.");
|
||||
} else {
|
||||
const { subOrgs, parentOrg } = responseJson;
|
||||
setSubOrgs(subOrgs);
|
||||
setParentOrg(parentOrg);
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log("Error getting sub orgs: ", error);
|
||||
toast("Error getting sub organizations");
|
||||
});
|
||||
};
|
||||
.catch((error) => {
|
||||
console.log("Error getting sub orgs: ", error);
|
||||
toast("Error getting sub organizations");
|
||||
});
|
||||
};
|
||||
|
||||
const handleClickChangeOrg = (orgId) => {
|
||||
// Don't really care about the logout
|
||||
@@ -4745,6 +4747,13 @@ const handleClickChangeOrg = (orgId) => {
|
||||
</div>
|
||||
) : null;
|
||||
|
||||
const imagesize = 40;
|
||||
const imageStyle = {
|
||||
width: imagesize,
|
||||
height: imagesize,
|
||||
pointerEvents: "none",
|
||||
};
|
||||
|
||||
const organizationsTab =
|
||||
curTab === 7 ? (
|
||||
<div>
|
||||
@@ -4765,95 +4774,245 @@ const handleClickChangeOrg = (orgId) => {
|
||||
>
|
||||
Add suborganization
|
||||
</Button>
|
||||
<Divider
|
||||
style={{
|
||||
marginTop: 20,
|
||||
marginBottom: 20,
|
||||
backgroundColor: theme.palette.inputColor,
|
||||
}}
|
||||
/>
|
||||
|
||||
{subOrgs.length > 0 ? (
|
||||
<span>
|
||||
<div style={{textAlign: 'center', width: '100%', padding: '10px', marginTop: 20 }}>
|
||||
<h3 style={{ margin: 0, fontSize: '1.2rem', fontWeight: 'bold', letterSpacing: '1px' }}>Sub Organizations of the Current Organization</h3>
|
||||
</div>
|
||||
|
||||
<Divider
|
||||
style={{
|
||||
marginTop: 20,
|
||||
marginBottom: 20,
|
||||
backgroundColor: theme.palette.inputColor,
|
||||
}}
|
||||
{parentOrg ? (
|
||||
<span>
|
||||
<Divider
|
||||
style={{
|
||||
marginTop: 20,
|
||||
marginBottom: 20,
|
||||
backgroundColor: theme.palette.inputColor,
|
||||
}}
|
||||
/>
|
||||
|
||||
<List>
|
||||
<ListItem>
|
||||
<ListItemText primary="Logo" style={{ minWidth: 100, maxWidth: 100 }} />
|
||||
<ListItemText primary="Name" style={{ minWidth: 250, maxWidth: 250 }} />
|
||||
<ListItemText primary="Your role" style={{ minWidth: 150, maxWidth: 150 }} />
|
||||
<ListItemText primary="id" style={{ minWidth: 400, maxWidth: 400 }} />
|
||||
</ListItem>
|
||||
<span>
|
||||
{subOrgs.map((data, index) => {
|
||||
const imagesize = 40;
|
||||
const imageStyle = {
|
||||
width: imagesize,
|
||||
height: imagesize,
|
||||
pointerEvents: "none",
|
||||
};
|
||||
const image =
|
||||
data.image === "" ? (
|
||||
<img alt={data.name} src={theme.palette.defaultImage} style={imageStyle} />
|
||||
) : (
|
||||
<img alt={data.name} src={data.image} style={imageStyle} />
|
||||
);
|
||||
|
||||
var bgColor = "#27292d";
|
||||
if (index % 2 === 0) {
|
||||
bgColor = "#1f2023";
|
||||
}
|
||||
|
||||
return (
|
||||
<ListItem key={index} style={{ backgroundColor: bgColor }}>
|
||||
<ListItemText primary={image} style={{ minWidth: 100, maxWidth: 100 }} />
|
||||
<ListItemText primary={data.name} style={{ minWidth: 250, maxWidth: 250 }} />
|
||||
<ListItemText primary={data.role} style={{ minWidth: 150, maxWidth: 150 }} />
|
||||
<ListItemText primary={data.id} style={{ minWidth: 400, maxWidth: 400 }} />
|
||||
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
disabled={userdata.admin !== "true"}
|
||||
onClick={() => {handleClickChangeOrg(data.id);}}
|
||||
>
|
||||
Switch Organization
|
||||
</Button>
|
||||
|
||||
</ListItem>
|
||||
<div
|
||||
style={{
|
||||
textAlign: "center",
|
||||
width: "100%",
|
||||
padding: "10px",
|
||||
marginTop: 20,
|
||||
}}
|
||||
>
|
||||
<h3
|
||||
style={{
|
||||
margin: 0,
|
||||
fontSize: "1.2rem",
|
||||
fontWeight: "bold",
|
||||
letterSpacing: "1px",
|
||||
}}
|
||||
>
|
||||
{" "}
|
||||
Your Parent Organization
|
||||
</h3>
|
||||
</div>
|
||||
<Divider
|
||||
style={{
|
||||
marginTop: 20,
|
||||
marginBottom: 20,
|
||||
backgroundColor: theme.palette.inputColor,
|
||||
}}
|
||||
/>
|
||||
{(() => {
|
||||
const image =
|
||||
parentOrg.image === "" ? (
|
||||
<img
|
||||
alt={parentOrg.name}
|
||||
src={theme.palette.defaultImage}
|
||||
style={imageStyle}
|
||||
/>
|
||||
) : (
|
||||
<img
|
||||
alt={parentOrg.name}
|
||||
src={parentOrg.image}
|
||||
style={imageStyle}
|
||||
/>
|
||||
);
|
||||
})}
|
||||
</span>
|
||||
</List>
|
||||
const bgColor = "#27292d";
|
||||
|
||||
return (
|
||||
<List>
|
||||
<ListItem>
|
||||
<ListItemText
|
||||
primary="Logo"
|
||||
style={{ minWidth: 100, maxWidth: 100 }}
|
||||
/>
|
||||
<ListItemText
|
||||
primary="Name"
|
||||
style={{ minWidth: 250, maxWidth: 250 }}
|
||||
/>
|
||||
<ListItemText
|
||||
primary="Your role"
|
||||
style={{ minWidth: 150, maxWidth: 150 }}
|
||||
/>
|
||||
<ListItemText
|
||||
primary="id"
|
||||
style={{ minWidth: 400, maxWidth: 400 }}
|
||||
/>
|
||||
</ListItem>
|
||||
<ListItem style={{ backgroundColor: bgColor }}>
|
||||
<ListItemText
|
||||
primary={image}
|
||||
style={{ minWidth: 100, maxWidth: 100 }}
|
||||
/>
|
||||
<ListItemText
|
||||
primary={parentOrg.name}
|
||||
style={{ minWidth: 250, maxWidth: 250 }}
|
||||
/>
|
||||
<ListItemText
|
||||
primary={parentOrg.role}
|
||||
style={{ minWidth: 150, maxWidth: 150 }}
|
||||
/>
|
||||
<ListItemText
|
||||
primary={parentOrg.id}
|
||||
style={{ minWidth: 400, maxWidth: 400 }}
|
||||
/>
|
||||
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
onClick={() => {
|
||||
handleClickChangeOrg(parentOrg.id);
|
||||
}}
|
||||
>
|
||||
Switch To Parent
|
||||
</Button>
|
||||
</ListItem>
|
||||
</List>
|
||||
);
|
||||
})()}
|
||||
</span>
|
||||
) : null
|
||||
}
|
||||
|
||||
{subOrgs.length > 0 ? (
|
||||
<span>
|
||||
<Divider
|
||||
style={{
|
||||
marginTop: 20,
|
||||
marginBottom: 20,
|
||||
backgroundColor: theme.palette.inputColor,
|
||||
}}
|
||||
/>
|
||||
<div
|
||||
style={{
|
||||
textAlign: "center",
|
||||
width: "100%",
|
||||
padding: "10px",
|
||||
marginTop: 20,
|
||||
}}
|
||||
>
|
||||
<h3
|
||||
style={{
|
||||
margin: 0,
|
||||
fontSize: "1.2rem",
|
||||
fontWeight: "bold",
|
||||
letterSpacing: "1px",
|
||||
}}
|
||||
>
|
||||
Sub Organizations of the Current Organization
|
||||
</h3>
|
||||
</div>
|
||||
|
||||
<Divider
|
||||
style={{
|
||||
marginTop: 20,
|
||||
marginBottom: 20,
|
||||
backgroundColor: theme.palette.inputColor,
|
||||
}}
|
||||
/>
|
||||
|
||||
<List>
|
||||
<ListItem>
|
||||
<ListItemText
|
||||
primary="Logo"
|
||||
style={{ minWidth: 100, maxWidth: 100 }}
|
||||
/>
|
||||
<ListItemText
|
||||
primary="Name"
|
||||
style={{ minWidth: 250, maxWidth: 250 }}
|
||||
/>
|
||||
<ListItemText
|
||||
primary="Your role"
|
||||
style={{ minWidth: 150, maxWidth: 150 }}
|
||||
/>
|
||||
<ListItemText primary="id" style={{ minWidth: 400, maxWidth: 400 }} />
|
||||
</ListItem>
|
||||
<span>
|
||||
{subOrgs.map((data, index) => {
|
||||
const image =
|
||||
data.image === "" ? (
|
||||
<img
|
||||
alt={data.name}
|
||||
src={theme.palette.defaultImage}
|
||||
style={imageStyle}
|
||||
/>
|
||||
) : (
|
||||
<img alt={data.name} src={data.image} style={imageStyle} />
|
||||
);
|
||||
|
||||
var bgColor = "#27292d";
|
||||
if (index % 2 === 0) {
|
||||
bgColor = "#1f2023";
|
||||
}
|
||||
|
||||
return (
|
||||
<ListItem key={index} style={{ backgroundColor: bgColor }}>
|
||||
<ListItemText
|
||||
primary={image}
|
||||
style={{ minWidth: 100, maxWidth: 100 }}
|
||||
/>
|
||||
<ListItemText
|
||||
primary={data.name}
|
||||
style={{ minWidth: 250, maxWidth: 250 }}
|
||||
/>
|
||||
<ListItemText
|
||||
primary={data.role}
|
||||
style={{ minWidth: 150, maxWidth: 150 }}
|
||||
/>
|
||||
<ListItemText
|
||||
primary={data.id}
|
||||
style={{ minWidth: 400, maxWidth: 400 }}
|
||||
/>
|
||||
|
||||
<Button
|
||||
variant="contained"
|
||||
color="primary"
|
||||
onClick={() => {
|
||||
handleClickChangeOrg(data.id);
|
||||
}}
|
||||
>
|
||||
Change Active Org
|
||||
</Button>
|
||||
</ListItem>
|
||||
);
|
||||
})}
|
||||
</span>
|
||||
</List>
|
||||
</span>
|
||||
) : null
|
||||
}
|
||||
|
||||
</span>
|
||||
) : (
|
||||
<div style={{ textAlign: 'center', marginTop: 20 }}>
|
||||
<h3 style={{ margin: 0, color: '#b0bec5', fontSize: '1rem', fontStyle: 'italic' }}>No Sub-Organizations found for the Current Organization</h3>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<Divider
|
||||
style={{
|
||||
marginTop: 20,
|
||||
marginBottom: 20,
|
||||
backgroundColor: theme.palette.inputColor,
|
||||
}}
|
||||
/>
|
||||
style={{
|
||||
marginTop: 20,
|
||||
marginBottom: 20,
|
||||
backgroundColor: theme.palette.inputColor,
|
||||
}}
|
||||
/>
|
||||
|
||||
<div style={{textAlign: 'center', width: '100%', padding: '10px', marginTop: 20 }}>
|
||||
<h3 style={{ margin: 0, fontSize: '1.2rem', fontWeight: 'bold', letterSpacing: '1px' }}>All Tenants</h3>
|
||||
</div>
|
||||
<div style={{ textAlign: "center", width: "100%", padding: "10px", marginTop: 20 }}>
|
||||
<h3
|
||||
style={{
|
||||
margin: 0,
|
||||
fontSize: "1.2rem",
|
||||
fontWeight: "bold",
|
||||
letterSpacing: "1px",
|
||||
}}
|
||||
>
|
||||
All Tenants
|
||||
</h3>
|
||||
</div>
|
||||
|
||||
<Divider
|
||||
style={{
|
||||
@@ -4901,12 +5060,6 @@ const handleClickChangeOrg = (orgId) => {
|
||||
? "True"
|
||||
: "False";
|
||||
|
||||
const imagesize = 40;
|
||||
const imageStyle = {
|
||||
width: imagesize,
|
||||
height: imagesize,
|
||||
pointerEvents: "none",
|
||||
};
|
||||
const image =
|
||||
data.image === "" ? (
|
||||
<img
|
||||
|
||||
Reference in New Issue
Block a user