Protei/PromucFlow_constructor
2
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

iFrame - When the source url is removed message should be displayed in iframe similar to other widgets (#6295)

Browse Source 
* FIX-5414 : iFrame - When the source url is removed message is be displayed within the component
This commit is contained in:
Paul Li 2021-08-05 01:20:02 -04:00 committed by GitHub
parent 11ceb0f7f1
commit 862e9f412e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 15 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
app/client/src/components/designSystems/blueprint/IframeComponent.tsx
View File

@ -1,4 +1,4 @@
import React, { useEffect } from "react";
import React, { useEffect, useState } from "react";
import styled from "styled-components";
import { ComponentProps } from "components/designSystems/appsmith/BaseComponent";
@ -11,7 +11,13 @@ interface IframeContainerProps {
}
export const IframeContainer = styled.div<IframeContainerProps>`
display: flex;
align-items: center;
justify-content: center;
height: 100%;
background-color: #ffffff;
font-weight: bold;
iframe {
width: 100%;
height: 100%;
@ -49,6 +55,8 @@ function IframeComponent(props: IframeComponentProps) {
title,
} = props;
const [message, setMessage] = useState("");
useEffect(() => {
// add a listener
window.addEventListener("message", onMessageReceived, false);
@ -59,6 +67,11 @@ function IframeComponent(props: IframeComponentProps) {
useEffect(() => {
onURLChanged(source);
if (!source) {
setMessage("Valid source url is required");
} else {
setMessage("");
}
}, [source]);
return (
@ -67,7 +80,7 @@ function IframeComponent(props: IframeComponentProps) {
borderOpacity={borderOpacity}
borderWidth={borderWidth}
>
<iframe src={source} title={title} />
{message ? message : <iframe src={source} title={title} />}
</IframeContainer>
);
}