diff --git a/Client/src/Components/Inputs/TextInput/Adornments/index.jsx b/Client/src/Components/Inputs/TextInput/Adornments/index.jsx index 1faf784c9..5c309b3a6 100644 --- a/Client/src/Components/Inputs/TextInput/Adornments/index.jsx +++ b/Client/src/Components/Inputs/TextInput/Adornments/index.jsx @@ -6,7 +6,7 @@ import Visibility from "@mui/icons-material/Visibility"; import Docs from "../../../../assets/icons/docs.svg?react"; import DeleteIcon from "../../../../assets/icons/trash-bin.svg?react"; -export const HttpAdornment = ({ https }) => { +export const HttpAdornment = ({ https, prefix }) => { const theme = useTheme(); return ( { color={theme.palette.text.secondary} sx={{ lineHeight: 1, opacity: 0.8 }} > - {https ? "https" : "http"}:// + {prefix !== undefined ? prefix : https ? "https://" : "http://"} ); @@ -33,6 +33,7 @@ export const HttpAdornment = ({ https }) => { HttpAdornment.propTypes = { https: PropTypes.bool.isRequired, + prefix: PropTypes.string, }; export const PasswordEndAdornment = ({ fieldType, setFieldType }) => { @@ -69,12 +70,11 @@ PasswordEndAdornment.propTypes = { export const ServerStartAdornment = () => { return ( - + ); }; - export const ServerEndAdornment = ({ id, removeItem }) => { const theme = useTheme(); return ( @@ -95,7 +95,7 @@ export const ServerEndAdornment = ({ id, removeItem }) => { }, }} > - + ); diff --git a/Client/src/Components/TabPanels/Status/Card/Server/index.jsx b/Client/src/Components/TabPanels/Status/Card/Server/index.jsx index ee2934d7f..ed874ec01 100644 --- a/Client/src/Components/TabPanels/Status/Card/Server/index.jsx +++ b/Client/src/Components/TabPanels/Status/Card/Server/index.jsx @@ -2,7 +2,7 @@ import TextInput from "../../../../Inputs/TextInput"; import { ServerStartAdornment, ServerEndAdornment } from "../../../../Inputs/TextInput/Adornments"; -const Server = ({ id, removeItem, value }) => { +const Server = ({ id, removeItem, value, onChange }) => { return ( { } id={id} value= {value} + onChange ={ onChange } > ); }; diff --git a/Client/src/Components/TabPanels/Status/Card/index.jsx b/Client/src/Components/TabPanels/Status/Card/index.jsx index 6a89618ff..456b0ab22 100644 --- a/Client/src/Components/TabPanels/Status/Card/index.jsx +++ b/Client/src/Components/TabPanels/Status/Card/index.jsx @@ -14,13 +14,14 @@ const CustomCard = React.forwardRef((props, ref) => ( id={props.id} removeItem={props.removeCard} value={props.value} + onChange={props.onChange} /> )); -const MyCard = ({ id, index, moveCard, removeCard, value }) => { +const MyCard = ({ id, index, moveCard, removeCard, value, onChange }) => { const ref = useRef(null); const [, drop] = useDrop({ accept: ItemTypes.CARD, @@ -81,6 +82,7 @@ const MyCard = ({ id, index, moveCard, removeCard, value }) => { id={id} removeCard={removeCard} value={value} + onChange={onChange} /> ); }; diff --git a/Client/src/Components/TabPanels/Status/ContentPanel.jsx b/Client/src/Components/TabPanels/Status/ContentPanel.jsx index 98005e22e..88eb3b912 100644 --- a/Client/src/Components/TabPanels/Status/ContentPanel.jsx +++ b/Client/src/Components/TabPanels/Status/ContentPanel.jsx @@ -8,6 +8,7 @@ import { buildErrors } from "../../../Validation/error"; import { hasValidationErrors } from "../../../Validation/error"; import Card from "./Card"; import update from "immutability-helper"; +import Checkbox from "../../Inputs/Checkbox"; const ContentPanel = () => { const theme = useTheme(); @@ -15,6 +16,9 @@ const ContentPanel = () => { // Local state for form data, errors, and file handling const [localData, setLocalData] = useState({ monitors: [], + showUptimePercentage: false, + showBarcode: false + }); const [cards, setCards] = useState(localData.monitors); @@ -52,6 +56,17 @@ const ContentPanel = () => { })); }; + const handleCardChange = (event) => { + event.preventDefault(); + const { value, id } = event.target; + let idx = cards.findIndex((a) => a.id == id); + if (idx >= 0) { + let x = JSON.parse(JSON.stringify(cards[idx])); + x.url = value; + setCards(update(cards, { $splice: [[idx, 1, x]] })); + } else setCards(update(cards, { $push: [{ id: id, url: value }] })); + } + const handleSubmit = () => { if (hasValidationErrors(localData, publicPageGeneralSettingsValidation, setErrors)) { return; @@ -154,7 +169,8 @@ const ContentPanel = () => { text={"" + idx} moveCard={moveCard} removeCard={removeCard} - value={card?.url ?? card?.id} + value={card?.url} + onChange = {handleCardChange} /> ))} @@ -162,6 +178,33 @@ const ContentPanel = () => { + + + + Features + Show more details on the status page + + + + + + + { type="url" label="SubURL" value={localData.url} - startAdornment={} - //prefix={"http://uptimegenie.com/"} + startAdornment={} onChange={handleChange} onBlur={handleBlur} helperText={errors["url"]}