Testing Options control tests, while Settings are UI mode settings. <img width="298" alt="Screenshot 2024-07-25 at 10 54 22 AM" src="https://github.com/user-attachments/assets/7b6f5fff-687b-48d1-80b3-d1e6f2a257e8"> These sections are separately expandable, collapsed by default. <img width="294" alt="Screenshot 2024-07-24 at 2 06 25 PM" src="https://github.com/user-attachments/assets/5d35ac8c-9289-46ca-aaa2-ebc5419fa0c4"> References #31520. --------- Signed-off-by: Simon Knott <info@simonknott.de> Co-authored-by: Simon Knott <info@simonknott.de>
35 lines
1.1 KiB
TypeScript
35 lines
1.1 KiB
TypeScript
/**
|
|
* Copyright (c) Microsoft Corporation.
|
|
*
|
|
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
* you may not use this file except in compliance with the License.
|
|
* You may obtain a copy of the License at
|
|
*
|
|
* http://www.apache.org/licenses/LICENSE-2.0
|
|
*
|
|
* Unless required by applicable law or agreed to in writing, software
|
|
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
* See the License for the specific language governing permissions and
|
|
* limitations under the License.
|
|
*/
|
|
|
|
import * as React from 'react';
|
|
import type { Setting } from '@web/uiUtils';
|
|
import './settingsView.css';
|
|
|
|
export const SettingsView: React.FunctionComponent<{
|
|
settings: Setting<boolean>[],
|
|
}> = ({ settings }) => {
|
|
return <div className='vbox settings-view'>
|
|
{settings.map(([value, set, title]) => {
|
|
return <div key={title} className='setting'>
|
|
<label>
|
|
<input type='checkbox' checked={value} onClick={() => set(!value)}/>
|
|
{title}
|
|
</label>
|
|
</div>;
|
|
})}
|
|
</div>;
|
|
};
|