Grasscutters/mitmproxy
3
0
Fork 0
mirror of https://github.com/Grasscutters/mitmproxy.git synced 2024-11-22 07:08:10 +00:00
Code Issues Projects Releases Wiki Activity

[web] move options editor from file menu to options menu

Browse Source 
ultimately we probably want to open the options editor immediately if someone presses "Options".
This still requires us to

  1. have a nicer editors for common settings.
  2. Add a "view event log" button somewhere else,
     for example in the footer.

For now, the options editor is marked as beta, as there are some options you
clearly do not want to edit (e.g. wfile).
This commit is contained in:
Maximilian Hils 2017-10-25 15:57:16 +02:00
parent 42895f4fec
commit c2401e35f4
2 changed files with 34 additions and 59 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
web/src/js/components/Header/FileMenu.jsx
View File

@ -11,7 +11,6 @@ FileMenu.propTypes = {
clearFlows: PropTypes.func.isRequired,
loadFlows: PropTypes.func.isRequired,
saveFlows: PropTypes.func.isRequired,
openModal: PropTypes.func.isRequired,
}
FileMenu.onNewClick = (e, clearFlows) => {
@ -20,7 +19,7 @@ FileMenu.onNewClick = (e, clearFlows) => {
clearFlows()
}
export function FileMenu ({clearFlows, loadFlows, saveFlows, openOptions}) {
export function FileMenu ({clearFlows, loadFlows, saveFlows}) {
return (
<Dropdown className="pull-left" btnClass="special" text="mitmproxy">
<a href="#" onClick={e => FileMenu.onNewClick(e, clearFlows)}>
@ -38,12 +37,7 @@ export function FileMenu ({clearFlows, loadFlows, saveFlows, openOptions}) {
</a>
<HideInStatic>
<a href="#" onClick={e => { e.preventDefault(); openOptions(); }}>
<i className="fa fa-fw fa-cog"></i>
&nbsp;Options
</a>
<Divider/>
<a href="http://mitm.it/" target="_blank">
<i className="fa fa-fw fa-external-link"></i>
&nbsp;Install Certificates...
@ -59,6 +53,5 @@ export default connect(
clearFlows: flowsActions.clear,
loadFlows: flowsActions.upload,
saveFlows: flowsActions.download,
openOptions: () => modalActions.setActiveModal('OptionModal'),
}
)(FileMenu)

84
web/src/js/components/Header/OptionMenu.jsx
View File

@ -1,74 +1,56 @@
import React from "react"
import PropTypes from 'prop-types'
import React from "react"
import { connect } from "react-redux"
import { SettingsToggle, EventlogToggle } from "./MenuToggle"
import { EventlogToggle, SettingsToggle } from "./MenuToggle"
import Button from "../common/Button"
import DocsLink from "../common/DocsLink"
import HideInStatic from "../common/HideInStatic";
import * as modalActions from "../../ducks/ui/modal"
OptionMenu.title = 'Options'
export default function OptionMenu() {
function OptionMenu({ openOptions }) {
return (
<div>
<HideInStatic>
<div className="menu-group">
<div className="menu-content">
<SettingsToggle setting="http2">HTTP/2.0</SettingsToggle>
<SettingsToggle setting="websocket">WebSockets</SettingsToggle>
<SettingsToggle setting="rawtcp">Raw TCP</SettingsToggle>
<div className="menu-group">
<div className="menu-content">
<Button title="Open Options" icon="fa-cogs text-primary"
onClick={openOptions}>
Edit Options <sup>alpha</sup>
</Button>
</div>
<div className="menu-legend">Options Editor</div>
</div>
<div className="menu-legend">Protocol Support</div>
</div>
<div className="menu-group">
<div className="menu-content">
<SettingsToggle setting="anticache">
Disable Caching <DocsLink resource="features/anticache.html"/>
</SettingsToggle>
<SettingsToggle setting="anticomp">
Disable Compression <i className="fa fa-question-circle"
title="Do not forward Accept-Encoding headers to the server to force an uncompressed response."></i>
</SettingsToggle>
<div className="menu-group">
<div className="menu-content">
<SettingsToggle setting="anticache">
Strip cache headers <DocsLink resource="features/anticache.html"/>
</SettingsToggle>
<SettingsToggle setting="showhost">
Use host header for display
</SettingsToggle>
<SettingsToggle setting="ssl_insecure">
Verify server certificates
</SettingsToggle>
</div>
<div className="menu-legend">Quick Options</div>
</div>
<div className="menu-legend">HTTP Options</div>
</div>
</HideInStatic>
<div className="menu-group">
<div className="menu-content">
<HideInStatic>
<SettingsToggle setting="showhost">
Use Host Header <i className="fa fa-question-circle"
title="Use the Host header to construct URLs for display."></i>
</SettingsToggle>
</HideInStatic>
<EventlogToggle/>
</div>
<div className="menu-legend">View Options</div>
</div>
{ /*
<ToggleButton text="no_upstream_cert"
checked={settings.no_upstream_cert}
onToggle={() => updateSettings({ no_upstream_cert: !settings.no_upstream_cert })}
/>
<ToggleInputButton name="stickyauth" placeholder="Sticky auth filter"
checked={!!settings.stickyauth}
txt={settings.stickyauth}
onToggleChanged={txt => updateSettings({ stickyauth: !settings.stickyauth ? txt : null })}
/>
<ToggleInputButton name="stickycookie" placeholder="Sticky cookie filter"
checked={!!settings.stickycookie}
txt={settings.stickycookie}
onToggleChanged={txt => updateSettings({ stickycookie: !settings.stickycookie ? txt : null })}
/>
<ToggleInputButton name="stream_large_bodies" placeholder="stream..."
checked={!!settings.stream_large_bodies}
txt={settings.stream_large_bodies}
inputType="number"
onToggleChanged={txt => updateSettings({ stream_large_bodies: !settings.stream_large_bodies ? txt : null })}
/>
*/}
</div>
)
}
export default connect(
null,
{
openOptions: () => modalActions.setActiveModal('OptionModal')
}
)(OptionMenu)