diff --git a/documentation/src/pages/install/index.tsx b/documentation/src/pages/install/index.tsx new file mode 100644 index 00000000..b532b724 --- /dev/null +++ b/documentation/src/pages/install/index.tsx @@ -0,0 +1,109 @@ +import React, { useState } from "react"; +import Head from "@docusaurus/Head"; +import { BlogFooter } from "@site/src/refine-theme/blog-footer"; +import { CommonHeader } from "@site/src/refine-theme/common-header"; +import { CommonLayout } from "@site/src/refine-theme/common-layout"; +import clsx from "clsx"; + +const Install: React.FC = () => { + const [options, setOptions] = useState({ + port: false, + lang: false, + hostname: false, + email: false, + password: false, + apache: true, // Default to true + phpfpm: true, // Default to true + // Add more options as needed + }); + + const [inputValues, setInputValues] = useState({ + // Define initial input values if needed + }); + + const handleOptionChange = (option: string) => { + setOptions((prevOptions) => ({ + ...prevOptions, + [option]: !prevOptions[option], + })); + }; + + const handleInputChange = (event: React.ChangeEvent) => { + const { name, value } = event.target; + setInputValues((prevInputValues) => ({ + ...prevInputValues, + [name]: value, + })); + }; + + const generateInstallCommand = () => { + // Implement logic to generate the install command based on selected options and input values + let command = "Your install command here"; + return command; + }; + + return ( + + + + +
+ + +
+

Installation instructions

+

+ Log in to your server e.g.{" "} + ssh root@your.server then download the installation + script: +

+ {/* Implement CopyToClipboardInput for first command */} + +

+ Check you are running as the root user, configure the + options you want below, then run: +

+ {/* Implement CopyToClipboardInput for second command */} + +

Configure options

+
    + {Object.keys(options).map((option) => ( +
  • +
    +
    + handleOptionChange(option)} + /> + +
    + {/* Implement tooltip icon */} +
    +
  • + ))} +
+ + {/* Implement input fields for additional input values */} + {/* Implement a button to generate the install command */} + +
+ +
+
+ ); +}; + +export default Install;