WIP Settings
This commit is contained in:
parent
9a24326f5f
commit
e28bf2648c
171
src/Settings.res
171
src/Settings.res
|
|
@ -1,116 +1,159 @@
|
|||
@react.component
|
||||
let make = () => {
|
||||
|
||||
module Form = {
|
||||
type proto = HTTP | HTTPS;
|
||||
type urlStyle = VHOST | PATH;
|
||||
module Proto = {
|
||||
type t = HTTP | HTTPS
|
||||
let default = HTTPS
|
||||
|
||||
type t = {
|
||||
protocol: option<proto>,
|
||||
endpoint: option<string>,
|
||||
url: option<urlStyle>,
|
||||
region: option<string>,
|
||||
keyId: option<string>,
|
||||
secretKey: option<string>,
|
||||
let make = str => switch(str) {
|
||||
| "http" => HTTP
|
||||
| _ => default
|
||||
}
|
||||
let make2 = mayStr => switch(mayStr) {
|
||||
| Some(str) => make(str)
|
||||
| None => default
|
||||
}
|
||||
|
||||
type e =
|
||||
| UndefinedParameter
|
||||
|
||||
let toStr = p => switch(p) {
|
||||
| HTTP => "http"
|
||||
| HTTPS => "https"
|
||||
}
|
||||
let isTls = p => p == HTTPS
|
||||
}
|
||||
|
||||
let make = () => { protocol: None, endpoint: None, url: None, region: None, keyId: None, secretKey: None }
|
||||
module UrlStyle = {
|
||||
type t = VHOST | PATH
|
||||
let default = PATH
|
||||
|
||||
let _build_unsafe = f => {
|
||||
open Belt.Option
|
||||
let make = str => switch(str) {
|
||||
| "vhost" => VHOST
|
||||
| _ => default
|
||||
}
|
||||
let make2 = mayStr => switch(mayStr) {
|
||||
| Some(str) => make(str)
|
||||
| None => default
|
||||
}
|
||||
|
||||
let toStr = u => switch(u) {
|
||||
| PATH => "path"
|
||||
| VHOST => "vhost"
|
||||
}
|
||||
let isPathStyle = u => u == PATH
|
||||
}
|
||||
|
||||
module LocalKV = {
|
||||
open Dom
|
||||
let get = (key) => Storage2.localStorage -> Storage2.getItem(key)
|
||||
let set = (key, value) => Storage2.localStorage -> Storage2.setItem(key, value)
|
||||
}
|
||||
|
||||
module Config = {
|
||||
open Belt
|
||||
|
||||
type t = {
|
||||
protocol: Proto.t,
|
||||
url: UrlStyle.t,
|
||||
endpoint: string,
|
||||
region: string,
|
||||
keyId: string,
|
||||
secretKey: string,
|
||||
}
|
||||
|
||||
let make = () => {
|
||||
protocol: "conf_protocol" -> LocalKV.get -> Proto.make2,
|
||||
url: "conf_url" -> LocalKV.get -> UrlStyle.make2,
|
||||
endpoint: "conf_endpoint" -> LocalKV.get -> Option.getWithDefault("garage.deuxfleurs.fr"),
|
||||
region: "conf_region" -> LocalKV.get -> Option.getWithDefault("garage"),
|
||||
keyId: "conf_keyid" -> LocalKV.get -> Option.getWithDefault(""),
|
||||
secretKey: "conf_secretkey" -> LocalKV.get -> Option.getWithDefault(""),
|
||||
}
|
||||
|
||||
let build = c => {
|
||||
{
|
||||
S3.endpoint: Some({
|
||||
protocol: switch(f.protocol -> getExn) { | HTTP => "http" | _ => "https" },
|
||||
hostname: f.endpoint -> getExn,
|
||||
protocol: c.protocol -> Proto.toStr,
|
||||
hostname: c.endpoint,
|
||||
path: "/"
|
||||
}),
|
||||
credentials: Some({
|
||||
accessKeyId: f.keyId -> getExn,
|
||||
secretAccessKey: f.secretKey -> getExn,
|
||||
accessKeyId: c.keyId,
|
||||
secretAccessKey: c.secretKey,
|
||||
}),
|
||||
tls: Some((f.protocol -> getExn) == HTTPS),
|
||||
forcePathStyle: Some((f.url -> getExn) == PATH),
|
||||
region: Some(f.region -> getExn),
|
||||
}
|
||||
}
|
||||
|
||||
let build: t => Belt.Result.t<S3.config, e> = f => {
|
||||
switch(f -> _build_unsafe) {
|
||||
| config => Ok(config)
|
||||
| exception Not_found => Error(UndefinedParameter)
|
||||
tls: Some(c.protocol -> Proto.isTls),
|
||||
forcePathStyle: Some(c.url -> UrlStyle.isPathStyle),
|
||||
region: Some(c.region),
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
let (form, updateForm) = React.useState(_ => Form.make());
|
||||
let (config, updateConfig) = React.useState(_ => Config.make());
|
||||
|
||||
let login = _ => {
|
||||
Js.log(form -> Form.build)
|
||||
Js.log(config -> Config.build)
|
||||
}
|
||||
|
||||
let setProtocol = evt => {
|
||||
let value = switch (ReactEvent.Form.target(evt)["value"]) {
|
||||
| "http" => Form.HTTP
|
||||
| _ => Form.HTTPS
|
||||
}
|
||||
updateForm(form => {...form, protocol: Some(value)})
|
||||
let value = ReactEvent.Form.target(evt)["value"] -> Proto.make
|
||||
updateConfig(c => {...c, protocol: value})
|
||||
}
|
||||
|
||||
let setEndpoint = evt => {
|
||||
let value = (ReactEvent.Form.target(evt)["value"])
|
||||
updateForm(form => {...form, endpoint: Some(value) })
|
||||
updateConfig(c => {...c, endpoint: value })
|
||||
}
|
||||
|
||||
let setRegion = _ => ()
|
||||
let setRegion = evt => {
|
||||
let value = (ReactEvent.Form.target(evt)["value"])
|
||||
updateConfig(c => {...c, region: value })
|
||||
}
|
||||
|
||||
let setUrlStyle = evt => {
|
||||
let value = switch (ReactEvent.Form.target(evt)["value"]) {
|
||||
| "path" => Form.PATH
|
||||
| _ => Form.VHOST
|
||||
}
|
||||
updateForm(form => {...form, url: Some(value)})
|
||||
let value = ReactEvent.Form.target(evt)["value"] -> UrlStyle.make
|
||||
updateConfig(c => {...c, url: value })
|
||||
}
|
||||
|
||||
let setKeyId = _ => ()
|
||||
let setSecretKey = _ => ()
|
||||
let setKeyId = evt => {
|
||||
let value = (ReactEvent.Form.target(evt)["value"])
|
||||
updateConfig(c => {...c, keyId: value })
|
||||
}
|
||||
|
||||
let setSecretKey = evt => {
|
||||
let value = (ReactEvent.Form.target(evt)["value"])
|
||||
updateConfig(c => {...c, secretKey: value })
|
||||
}
|
||||
|
||||
<section className="menu">
|
||||
<div className="menu-title">{ "Configuration"->React.string }</div>
|
||||
<form>
|
||||
<fieldset>
|
||||
<legend> { `Réseau` -> React.string } </legend>
|
||||
<div className="group">
|
||||
<select name="protocol" onChange={setProtocol}>
|
||||
<div className="group">
|
||||
<select name="protocol" onChange={setProtocol} value={config.protocol -> Proto.toStr}>
|
||||
<option value="https">{ "https://"->React.string }</option>
|
||||
<option value="http">{ "http://"->React.string }</option>
|
||||
</select>
|
||||
<input name="endpoint" type_="text" placeholder="garage.example.tld" onChange={setEndpoint} />
|
||||
</div>
|
||||
<div className="group">
|
||||
<input name="region" type_="text" placeholder="garage" onChange={setRegion} />
|
||||
<select name="urlStyle" onChange={setUrlStyle} >
|
||||
<option value="path">{ "chemin"->React.string }</option>
|
||||
<option value="vhost">{ `hôte`->React.string }</option>
|
||||
</select>
|
||||
</div>
|
||||
<input name="endpoint" type_="text" placeholder="garage.example.tld" onChange={setEndpoint} value={config.endpoint} />
|
||||
</div>
|
||||
<div className="group">
|
||||
<input name="region" type_="text" placeholder="garage" onChange={setRegion} value={config.region} />
|
||||
<select name="urlStyle" onChange={setUrlStyle} value={config.url -> UrlStyle.toStr}>
|
||||
<option value="path">{ "chemin"->React.string }</option>
|
||||
<option value="vhost">{ `hôte`->React.string }</option>
|
||||
</select>
|
||||
</div>
|
||||
</fieldset>
|
||||
|
||||
<fieldset>
|
||||
<legend> { "Authentification"->React.string }</legend>
|
||||
<div className="group">
|
||||
<input name="keyId" type_="text" placeholder="GKxxx" onChange={setKeyId}/>
|
||||
</div>
|
||||
<div className="group">
|
||||
<input name="secretKey" type_="password" placeholder="************" onChange={setSecretKey} />
|
||||
</div>
|
||||
<div className="group">
|
||||
<input name="keyId" type_="text" placeholder="GKxxx" onChange={setKeyId} value={config.keyId} />
|
||||
</div>
|
||||
<div className="group">
|
||||
<input name="secretKey" type_="password" placeholder="************" onChange={setSecretKey} value={config.secretKey} />
|
||||
</div>
|
||||
</fieldset>
|
||||
|
||||
<input className="primary" type_="button" onClick={login} />
|
||||
<input className="primary" type_="button" onClick={login} value="Valider"/>
|
||||
</form>
|
||||
</section>
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue