honeymoose
/
sp-dev-fx-webparts
mirror of https://github.com/pnp/sp-dev-fx-webparts.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

enhance data retrieval from target site and target lists

This commit is contained in:
Tobias Maestrini 2024-02-25 18:31:45 +01:00
parent 127ad26e4b
commit aafab15462
2 changed files with 62 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

52
samples/react-personal-tools-list/src/webparts/myTools/components/MyTools.tsx
View File

@ -1,7 +1,7 @@
/* eslint-disable @typescript-eslint/no-floating-promises */
import * as React from "react";
import styles from "../styles/PersonalToolsListWebpart.module.scss";
import type {IMyToolsProps, ITool } from "../models";
import type { IMyToolsProps, ITool } from "../models";
import DialogTitle from "@mui/material/DialogTitle";
import DialogContent from "@mui/material/DialogContent";
import Button from "@mui/material/Button";
@ -14,7 +14,7 @@ import Dialog from "@mui/material/Dialog";
import { getSelectableTools, getUsersTools, updateUsersTools } from "../data/apiHelper";
const MyTools: React.FC<
IMyToolsProps
IMyToolsProps
> = (props) => {
/** === USE STATE HOOKS === */
const [open, setOpen] = React.useState(false);
@ -25,41 +25,45 @@ IMyToolsProps
const [selectableTools, setSelectableTools] = React.useState<Array<ITool>>(
[]
);
/** === VARIABLES === */
const errorMsgNotFound = "Could not find any tools saved for your user. Select 'Edit' to add some tools to this list.";
const errorMsgOnSave = "Something went wrong when saving your tools. Please try again or contact support.";
/** === USE EFFECT HOOKS === */
React.useEffect(() => {
(async () => {
const tmpTools = await getUsersTools(props.context, props.userEmail);
if (tmpTools) {
setMyTools(tmpTools);
} else {
setErrorMessage(
errorMsgNotFound
);
if (props.wpLists?.personalToolsList && props.wpSite?.url) {
const tmpTools = await getUsersTools(props.context, props.userEmail, { list: props.wpLists.personalToolsList, siteUrl: props.wpSite.url });
if (tmpTools) {
setMyTools(tmpTools);
} else {
setErrorMessage(
errorMsgNotFound
);
}
}
const tmpSelectTools = await getSelectableTools(props.context);
if (tmpSelectTools) {
setSelectableTools(tmpSelectTools);
if (props.wpLists?.availableToolsList && props.wpSite?.url) {
const tmpSelectTools = await getSelectableTools(props.context, { list: props.wpLists.availableToolsList, siteUrl: props.wpSite.url });
if (tmpSelectTools) {
setSelectableTools(tmpSelectTools);
}
}
})();
}, []);
}, [props]);
React.useEffect(() => {
if (myTools.length > 0 && errorMessage) {
setErrorMessage(undefined);
}
if(myTools.length === 0){
if (myTools.length === 0) {
setErrorMessage(
errorMsgNotFound
);
}
}, [myTools]);
/** === FUNCTIONS === */
/** === FUNCTIONS === */
const handleClickOpen = (): void => {
setOpen(true);
};
@ -73,12 +77,13 @@ IMyToolsProps
const updateSucess = await updateUsersTools(
props.context,
checked,
props.userEmail
props.userEmail,
{ list: props.wpLists?.personalToolsList, siteUrl: props.wpSite?.url }
);
if (updateSucess) {
const tmpTools = await getUsersTools(props.context, props.userEmail);
if (tmpTools) {
setMyTools(tmpTools);
const userTools = await getUsersTools(props.context, props.userEmail, { list: props.wpLists?.personalToolsList, siteUrl: props.wpSite?.url });
if (userTools) {
setMyTools(userTools);
} else {
setErrorMessage(
errorMsgNotFound
@ -95,9 +100,8 @@ IMyToolsProps
/** === TSX === */
return (
<section
className={`${styles.personalToolsListWebpart} ${
props.hasTeamsContext ? styles.teams : ""
}`}
className={`${styles.personalToolsListWebpart} ${props.hasTeamsContext ? styles.teams : ""
}`}
>
<Grid style={{ width: "100%", borderBottom: "1px solid #333" }} container>
<Grid item xs={12} md={8}>

53
samples/react-personal-tools-list/src/webparts/myTools/data/apiHelper.ts
View File

@ -1,16 +1,29 @@
import { WebPartContext } from "@microsoft/sp-webpart-base";
import { SPFx, spfi } from "@pnp/sp";
import { ITool } from "../models";
import { getSP } from "./pnpjs-config";
import { IWeb, Web } from '@pnp/sp/presets/all';
type ListDefintion = {
siteUrl?: string;
list?: { id: string, title: string, url: string };
}
const getSourceWeb = async (context: WebPartContext, siteUrl: string): Promise<IWeb> => {
const sp = getSP(context);
const { WebFullUrl } = await sp.web.getContextInfo(siteUrl);
const sourceWeb = Web([sp.web, decodeURI(WebFullUrl)]);
return sourceWeb;
}
export const getUsersTools = async (
context: WebPartContext,
currentUserMail: string
currentUserMail: string,
personalToolsList: ListDefintion,
): Promise<Array<ITool> | undefined> => {
const sp = getSP(context);
const requestRes = await sp.web.lists
.getByTitle("PersonalTools")
.items();
const sourceWeb = await getSourceWeb(context, personalToolsList?.siteUrl ?? '');
const sourceList = sourceWeb.lists.getById(personalToolsList?.list?.id ?? '');
const requestRes = await sourceList.items();
const userTools = requestRes.filter(
(userTools) => userTools.tool_username === currentUserMail
);
@ -24,10 +37,14 @@ export const getUsersTools = async (
};
export const getSelectableTools = async (
context: WebPartContext
context: WebPartContext,
availableToolsList: ListDefintion,
): Promise<Array<ITool>> => {
const sp = spfi().using(SPFx(context));
const requestRes = await sp.web.lists.getByTitle("AvailableTools").items();
console.log([context, availableToolsList]);
const sourceWeb = await getSourceWeb(context, availableToolsList?.siteUrl ?? '');
const sourceList = sourceWeb.lists.getById(availableToolsList?.list?.id ?? '');
const requestRes = await sourceList.items();
const tools = requestRes.map((tool) => {
return {
toolName: tool.tool_name,
@ -41,13 +58,13 @@ export const getSelectableTools = async (
export const updateUsersTools = async (
context: WebPartContext,
userTools: Array<ITool>,
currentUserMail: string
currentUserMail: string,
personalToolsList?: ListDefintion,
): Promise<boolean> => {
const sourceWeb = await getSourceWeb(context, personalToolsList?.siteUrl ?? '');
const sourceList = sourceWeb.lists.getById(personalToolsList?.list?.id ?? '');
const requestRes = await sourceList.items();
const sp = spfi().using(SPFx(context));
const requestRes = await sp.web.lists
.getByTitle("PersonalTools")
.items();
const tmpTools = requestRes.filter(
(userTools) => userTools.tool_username === currentUserMail
);
@ -59,8 +76,7 @@ export const updateUsersTools = async (
tool_username: currentUserMail,
};
if (tmpTools.length === 1) {
const update = await sp.web.lists
.getByTitle("PersonalTools")
const update = await sourceList
.items.getById(tmpTools[0].ID)
.update(userToolsObject)
.then((res) => {
@ -72,8 +88,7 @@ export const updateUsersTools = async (
});
return update;
} else if (tmpTools.length === 0) {
const addItem = await sp.web.lists
.getByTitle("PersonalTools")
const addItem = await sourceList
.items.add(userToolsObject)
.then((res) => {
return true;
@ -82,7 +97,7 @@ export const updateUsersTools = async (
console.log(error);
return false;
});
return addItem;
return addItem;
}
return false;
};