Skip to content

Commit

Permalink
Clean up code and fix bugs
Browse files Browse the repository at this point in the history
  • Loading branch information
@kenny-ciq
kenny-ciq committed Dec 22, 2022
1 parent 34e35f1 commit 6b46913
Show file tree
Hide file tree
Showing 10 changed files with 122 additions and 130 deletions.
112 changes: 52 additions & 60 deletions toolbox/fdc3-workbench/src/components/ChannelField.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -104,10 +104,6 @@ const useStyles = makeStyles((theme: Theme) =>
},
rightPadding: {
paddingRight: theme.spacing(0.5),
},
caption: {
color: "#0086bf",
marginTop: "10px"
}
})
);
Expand Down Expand Up @@ -228,7 +224,6 @@ export const ChannelField = observer(
};

const handleRemoveOrDisconnect = (channel: any) => {
console.log(channel, isPrivateChannel)
if(isPrivateChannel) {
privateChannelStore.disconnect(channel);
} else {
Expand All @@ -249,7 +244,6 @@ export const ChannelField = observer(
<Grid container key={channel.id} spacing={2} className={classes.spread}>
<Grid item className={classes.field}>
<Typography variant="h5">Channel: {channel.id}</Typography>
{isPrivateChannel && <Typography variant="caption" className={classes.caption}>Check listeners once results are received</Typography>}
</Grid>
<Grid container className={classes.topMargin}>
<Grid item xs={12}>
Expand Down Expand Up @@ -287,63 +281,61 @@ export const ChannelField = observer(
</Tooltip>
</Grid>
</Grid>
{!isPrivateChannel &&
<Grid container>
<Grid item xs={12}>
<Typography variant="h5" className={classes.h6}>
Add Context Listener
</Typography>
</Grid>
<Grid item sm={7} className={classes.rightPadding}>
<Autocomplete
size="small"
selectOnFocus
blurOnSelect
clearOnBlur
handleHomeEndKeys
value={channel.currentListener}
onChange={handleChangeAppListener(channel.id)}
filterOptions={filterOptions}
options={contextListenersOptions}
getOptionLabel={getOptionLabel}
renderOption={(option) => option.type}
renderInput={(params) => (
<TemplateTextField
label="CONTEXT TYPE"
placeholder="Enter Context Type"
variant="outlined"
{...params}
error={!!channel.listenerError}
helperText={channel.listenerError}
/>
)}
onKeyDown={(event) => {
if (event.key === "Enter") {
event.defaultPrevented = true;
handleAddContextListener(channel.id);
}
}}
/>
</Grid>
<Grid container>
<Grid item xs={12}>
<Typography variant="h5" className={classes.h6}>
Add Context Listener
</Typography>
</Grid>
<Grid item sm={7} className={classes.rightPadding}>
<Autocomplete
size="small"
selectOnFocus
blurOnSelect
clearOnBlur
handleHomeEndKeys
value={channel.currentListener}
onChange={handleChangeAppListener(channel.id)}
filterOptions={filterOptions}
options={contextListenersOptions}
getOptionLabel={getOptionLabel}
renderOption={(option) => option.type}
renderInput={(params) => (
<TemplateTextField
label="CONTEXT TYPE"
placeholder="Enter Context Type"
variant="outlined"
{...params}
error={!!channel.listenerError}
helperText={channel.listenerError}
/>
)}
onKeyDown={(event) => {
if (event.key === "Enter") {
event.defaultPrevented = true;
handleAddContextListener(channel.id);
}
}}
/>
</Grid>

<Grid item container className={classes.controls} sm={5} justifyContent="flex-end">
<Button variant="contained" color="primary" onClick={() => handleAddContextListener(channel.id)}>
Add Listener
</Button>
<Grid item container className={classes.controls} sm={5} justifyContent="flex-end">
<Button variant="contained" color="primary" onClick={() => handleAddContextListener(channel.id)}>
Add Listener
</Button>

<Tooltip title="Copy code example" aria-label="Copy code example">
<IconButton
size="small"
aria-label="Copy code example"
color="primary"
onClick={copyToClipboard(codeExamples.appChannelContextListener, "addchannelContextListener")}
>
<FileCopyIcon />
</IconButton>
</Tooltip>
</Grid>
<Tooltip title="Copy code example" aria-label="Copy code example">
<IconButton
size="small"
aria-label="Copy code example"
color="primary"
onClick={copyToClipboard(codeExamples.appChannelContextListener, "addchannelContextListener")}
>
<FileCopyIcon />
</IconButton>
</Tooltip>
</Grid>
}
</Grid>
<Button
variant="contained"
color="secondary"
Expand Down
28 changes: 17 additions & 11 deletions toolbox/fdc3-workbench/src/components/Header.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -69,7 +69,9 @@ export const Header = (props: { fdc3Available: boolean }) => {
const classes = useStyles();
const [appInfo, setAppInfo] = useState<any>();
const params = new URLSearchParams(window.location.search);
const warningText = `Your FDC3 version (${window.fdc3Version}) doesn't match the version of the FDC3 Workbench you are using (${appInfo?.appMetadata?.version})`;
const paramVersion = params.get("fdc3Version") || '';
const [chosenVersion, setChosenVersion] = useState<string>(Number(appInfo?.providerVersion.slice(0,3)) > 8.2 ? "2.0" : "1.2");
let warningText = `Your FDC3 version (${appInfo?.fdc3Version}) doesn't match the version of the FDC3 Workbench you are using (${chosenVersion})`;
const supportedVersion = ["2.0", "1.2"];

useEffect(() => {
Expand All @@ -78,7 +80,7 @@ export const Header = (props: { fdc3Available: boolean }) => {
const updateInfo = async () => {
try {
let implInfo: ImplementationMetadata = await fdc3.getInfo();

if(paramVersion) setChosenVersion(paramVersion);
let displayInfo = {
fdc3Version: "not specified",
provider: "not specified",
Expand All @@ -88,31 +90,35 @@ export const Header = (props: { fdc3Available: boolean }) => {
version: "not specified",
},
};
if (implInfo.fdc3Version) {
displayInfo.fdc3Version = params.get("fdc3Version") || implInfo.fdc3Version;
window.fdc3Version = displayInfo.fdc3Version;
}

if (implInfo.provider) {
displayInfo.provider = implInfo.provider;
}
if (implInfo.providerVersion) {
displayInfo.providerVersion = implInfo.providerVersion;

}
if (implInfo.fdc3Version) {
displayInfo.fdc3Version = implInfo.fdc3Version;
window.fdc3Version = chosenVersion || implInfo.fdc3Version;
}
if (implInfo.appMetadata) {
displayInfo.appMetadata = {
appId: implInfo.appMetadata.appId ? implInfo.appMetadata.appId : "not specified",
version: implInfo.appMetadata.version ? implInfo.appMetadata.version : "not specified",
};
}
setAppInfo(displayInfo);


setAppInfo(displayInfo);
} catch (e) {
console.error("Failed to retrieve FDC3 implementation info", e);
}
};

updateInfo();
}
}, [props.fdc3Available]);
}, [props.fdc3Available, chosenVersion]);

return (
<div className={classes.root}>
Expand All @@ -126,10 +132,10 @@ export const Header = (props: { fdc3Available: boolean }) => {
<Typography color="inherit">
{supportedVersion.map((ver, index) => (
<span key={index}>
{ver === appInfo?.fdc3Version ? (
{ver === chosenVersion ? (
<span>{ver}</span>
) : (
<a className={`${classes.link}`} href={`?fdc3Version=${ver}`}>
<a className={`${classes.link}`} href={`?fdc3Version=${ver}`} >
{ver}
</a>
)}
Expand All @@ -145,7 +151,7 @@ export const Header = (props: { fdc3Available: boolean }) => {
<tr>
<th scope="row">FDC3 Version</th>
{appInfo?.fdc3Version ? (
appInfo.appMetadata?.version.includes(appInfo.fdc3Version) ? (
chosenVersion === appInfo.fdc3Version ? (
<td>{appInfo.fdc3Version}</td>
) : (
<td className={classes.warningText}>
Expand Down
9 changes: 3 additions & 6 deletions toolbox/fdc3-workbench/src/components/IntentResolutionField.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -33,19 +33,16 @@ export const IntentResolutionField = observer(({ data, handleTabChange }: { data
let results = `appId: ${data.source.appId}\ninstanceId: ${data.source.instanceId}`;

const displayIntentResults = async () => {
console.log(data, data.hasOwnProperty("getResult"));
try {
if (data.hasOwnProperty("getResult")) {
console.log(data, data.hasOwnProperty("getResult"), await data.getResult());
const result = await data.getResult();
console.log(result);

//detect whether the result is Context or a Channel
if (!!result?.broadcast) {
setResolutionResult("");

//App Channel
if (result.type === "app") {
console.log(result.type);
await appChannelStore.getOrCreateChannel(result.id);
setChannelName(result.id);
setIsChannel(true);
Expand All @@ -54,7 +51,6 @@ export const IntentResolutionField = observer(({ data, handleTabChange }: { data

// Private Channel
if (result.type === "private") {
console.log(result.type);
setIsChannel(true);
setPrivateChannel(true);
setChannelsList([result]);
Expand All @@ -66,7 +62,8 @@ export const IntentResolutionField = observer(({ data, handleTabChange }: { data
}
}
} catch (error) {
setResolutionResult(`${error}`);
if(`${error}`.includes('NoResultReturned')) setResolutionResult('<void>')
else setResolutionResult(`${error}`);
console.error(`${data.source.appId} returned a result error: ${error}`);
}
};
Expand Down
23 changes: 13 additions & 10 deletions toolbox/fdc3-workbench/src/components/Intents.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -144,6 +144,10 @@ const useStyles = makeStyles((theme: Theme) =>
indentLeft: {
marginLeft: "30px",
},
caption: {
color: "#0086bf",
marginTop: "10px"
}
})
);

Expand Down Expand Up @@ -322,7 +326,6 @@ export const Intents = observer(({ handleTabChange }: { handleTabChange: any })
setIntentError("Enter intent");
return;
} else {
console.log(channelType);
intentStore.addIntentListener(
intentListener.value,
toJS(resultTypeContext),
Expand All @@ -333,6 +336,7 @@ export const Intents = observer(({ handleTabChange }: { handleTabChange: any })
);
setIntentListener(null);
}
setSendIntentResult(false)
};

const handleChannelTypeChange = (event: React.MouseEvent<HTMLElement>, nextView: string) => {
Expand All @@ -348,16 +352,15 @@ export const Intents = observer(({ handleTabChange }: { handleTabChange: any })
};

const setChannelContextList = (context: ContextType, index: number) => {
console.log(index, context);
setResultOverChannelContextList((curr: any) => {
return { ...curr, [index]: context };
});
};

const setChannelContextDelay = (delay: string, index: number) => {
console.log(index, delay);
setResultOverChannelContextDelays((curr: any) => {
return { ...curr, [index]: delay };
const lastDelay = curr[index - 1] || 0;
return { ...curr, [index]: lastDelay + Number(delay) };
});
};

Expand All @@ -382,7 +385,6 @@ export const Intents = observer(({ handleTabChange }: { handleTabChange: any })
</Grid>
</Grid>,
]);
console.log(contextFields);
};

useEffect(() => {
Expand Down Expand Up @@ -599,11 +601,11 @@ export const Intents = observer(({ handleTabChange }: { handleTabChange: any })
aria-label="Copy code example"
color="primary"
onClick={() => {
let exampleToUse = codeExamples.raiseIntent;
let exampleToUse = codeExamples.raiseIntent(JSON.stringify(raiseIntentContext, null, 2), String(intentValue));
if(targetInstance?.instanceId) {
exampleToUse = codeExamples.raiseIntentInstance;
exampleToUse = codeExamples.raiseIntentInstance(JSON.stringify(raiseIntentContext, null, 2), String(intentValue));
} else if(targetApp) {
exampleToUse = codeExamples.raiseIntentTarget;
exampleToUse = codeExamples.raiseIntentTarget(JSON.stringify(raiseIntentContext, null, 2), String(intentValue));
}
copyToClipboard(exampleToUse, "raiseIntent")()
}}
Expand Down Expand Up @@ -903,6 +905,7 @@ export const Intents = observer(({ handleTabChange }: { handleTabChange: any })
</Grid>
)}
<FormGroup>
{channelType === "private-channel" && <Typography variant="caption" className={classes.caption}>Context streaming will start AFTER a context listener is added to the channel</Typography>}
<FormControlLabel
control={
<Checkbox
Expand All @@ -921,10 +924,10 @@ export const Intents = observer(({ handleTabChange }: { handleTabChange: any })
<React.Fragment key={index}>{field}</React.Fragment>
))}
<Grid item className={classes.indentLeft}>
<Tooltip title="Add context result" aria-label="Add context result">
<Tooltip title="Add context result (delays will trigger sequentially)" aria-label="Add context result (delays will trigger sequentially)">
<IconButton
size="small"
aria-label="Add context result"
aria-label="Add context result (delays will trigger sequentially)"
color="primary"
onClick={handleAddContextField}
>
Expand Down
1 change: 0 additions & 1 deletion toolbox/fdc3-workbench/src/components/Workbench/AppChannelListeners.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,6 @@ export const AppChannelListeners = observer(() => {

appChannelStore.channelListeners.forEach(({ id, channelId, type, lastReceivedContext, metaData }) => {
const receivedContextListenerValue = lastReceivedContext ? JSON.stringify(lastReceivedContext, undefined, 4) : "";
console.log(lastReceivedContext, metaData);
const contextField = (
<div>
<TextField
Expand Down
4 changes: 2 additions & 2 deletions toolbox/fdc3-workbench/src/components/Workbench/PrivateChannelListeners.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ export const PrivateChannelListeners = observer(() => {

let contextListeners: AccordionListItem[] = [];

privateChannelStore.channelListeners.forEach(({ id, channelId, lastReceivedContext, metaData }) => {
privateChannelStore.channelListeners.forEach(({ id, channelId, type, lastReceivedContext, metaData }) => {
const receivedContextListenerValue = lastReceivedContext ? JSON.stringify(lastReceivedContext, undefined, 4) : "";
const contextField = (
<div>
Expand All @@ -50,7 +50,7 @@ export const PrivateChannelListeners = observer(() => {
</div>
);

contextListeners.push({ id, textPrimary: `Channel Id: ${channelId}`, afterEachElement: contextField });
contextListeners.push({ id, textPrimary: `Channel Id: ${channelId}: ${type}`, afterEachElement: contextField });
});

const handleDeleteListener = (id: string) => {
Expand Down
Loading

0 comments on commit 6b46913

Please sign in to comment.