mirror of
https://github.com/tiqi-group/pydase.git
synced 2025-04-22 01:00:02 +02:00
Merge pull request #113 from tiqi-group/feat/frontend_display_toggle
Feat: frontend display toggle
This commit is contained in:
commit
8310a51a74
@ -831,7 +831,8 @@ Please ensure that the CSS file path is accessible from the server's running loc
|
||||
`pydase` enables users to customize the frontend layout via the `web_settings.json` file. Each key in the file corresponds to the full access path of public attributes, properties, and methods of the exposed service, using dot-notation.
|
||||
|
||||
- **Custom Display Names**: Modify the `"displayName"` value in the file to change how each component appears in the frontend.
|
||||
<!-- - **Adjustable Component Order**: The `"index"` values determine the order of components. Alter these values to rearrange the components as desired. -->
|
||||
- **Control Component Visibility**: Utilize the `"display"` key-value pair to control whether a component is rendered in the frontend. Set the value to `true` to make the component visible or `false` to hide it.
|
||||
<!-- - **Adjustable Component Order**: The `"displayOrder"` values determine the order of components. Alter these values to rearrange the components as desired. -->
|
||||
|
||||
The `web_settings.json` file will be stored in the directory specified by `SERVICE_CONFIG_DIR`. You can generate a `web_settings.json` file by setting the `GENERATE_WEB_SETTINGS` to `True`. For more information, see the [configuration section](#configuring-pydase-via-environment-variables).
|
||||
|
||||
|
@ -4,5 +4,6 @@ export const WebSettingsContext = createContext<Record<string, WebSetting>>({});
|
||||
|
||||
export type WebSetting = {
|
||||
displayName: string;
|
||||
display: boolean;
|
||||
index: number;
|
||||
};
|
||||
|
@ -62,8 +62,13 @@ export const GenericComponent = React.memo(
|
||||
const webSettings = useContext(WebSettingsContext);
|
||||
let displayName = name;
|
||||
|
||||
if (webSettings[fullAccessPath] && webSettings[fullAccessPath].displayName) {
|
||||
displayName = webSettings[fullAccessPath].displayName;
|
||||
if (webSettings[fullAccessPath]) {
|
||||
if (webSettings[fullAccessPath].display === false) {
|
||||
return null;
|
||||
}
|
||||
if (webSettings[fullAccessPath].displayName) {
|
||||
displayName = webSettings[fullAccessPath].displayName;
|
||||
}
|
||||
}
|
||||
|
||||
function changeCallback(
|
||||
|
@ -1,13 +1,13 @@
|
||||
{
|
||||
"files": {
|
||||
"main.css": "/static/css/main.7ef670d5.css",
|
||||
"main.js": "/static/js/main.ca0b4800.js",
|
||||
"main.js": "/static/js/main.97ef73ea.js",
|
||||
"index.html": "/index.html",
|
||||
"main.7ef670d5.css.map": "/static/css/main.7ef670d5.css.map",
|
||||
"main.ca0b4800.js.map": "/static/js/main.ca0b4800.js.map"
|
||||
"main.97ef73ea.js.map": "/static/js/main.97ef73ea.js.map"
|
||||
},
|
||||
"entrypoints": [
|
||||
"static/css/main.7ef670d5.css",
|
||||
"static/js/main.ca0b4800.js"
|
||||
"static/js/main.97ef73ea.js"
|
||||
]
|
||||
}
|
@ -1 +1 @@
|
||||
<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="/favicon.ico"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><meta name="description" content="Web site displaying a pydase UI."/><link rel="apple-touch-icon" href="/logo192.png"/><link rel="manifest" href="/manifest.json"/><title>pydase App</title><script defer="defer" src="/static/js/main.ca0b4800.js"></script><link href="/static/css/main.7ef670d5.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>
|
||||
<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="/favicon.ico"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><meta name="description" content="Web site displaying a pydase UI."/><link rel="apple-touch-icon" href="/logo192.png"/><link rel="manifest" href="/manifest.json"/><title>pydase App</title><script defer="defer" src="/static/js/main.97ef73ea.js"></script><link href="/static/css/main.7ef670d5.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>
|
File diff suppressed because one or more lines are too long
1
src/pydase/frontend/static/js/main.97ef73ea.js.map
Normal file
1
src/pydase/frontend/static/js/main.97ef73ea.js.map
Normal file
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -130,7 +130,10 @@ class WebServer:
|
||||
if path in current_web_settings:
|
||||
continue
|
||||
|
||||
current_web_settings[path] = {"displayName": path.split(".")[-1]}
|
||||
current_web_settings[path] = {
|
||||
"displayName": path.split(".")[-1],
|
||||
"display": True,
|
||||
}
|
||||
|
||||
return current_web_settings
|
||||
|
||||
|
@ -26,8 +26,8 @@ def test_web_settings() -> None:
|
||||
observer = DataServiceObserver(state_manager)
|
||||
with tempfile.TemporaryDirectory() as tmp:
|
||||
web_settings = {
|
||||
"attr_1": {"displayName": "Attribute"},
|
||||
"attr_1.name": {"displayName": "Attribute name"},
|
||||
"attr_1": {"displayName": "Attribute", "display": False},
|
||||
"attr_1.name": {"displayName": "Attribute name", "display": True},
|
||||
}
|
||||
web_settings_file = Path(tmp) / "web_settings.json"
|
||||
|
||||
@ -44,8 +44,11 @@ def test_web_settings() -> None:
|
||||
new_web_settings = server.web_settings
|
||||
|
||||
# existing entries are not overwritten, new entries are appended
|
||||
assert new_web_settings == {**web_settings, "added": {"displayName": "added"}}
|
||||
assert new_web_settings == {
|
||||
**web_settings,
|
||||
"added": {"displayName": "added", "display": True},
|
||||
}
|
||||
assert json.loads(web_settings_file.read_text()) == {
|
||||
**web_settings,
|
||||
"added": {"displayName": "added"},
|
||||
"added": {"displayName": "added", "display": True},
|
||||
}
|
||||
|
Loading…
x
Reference in New Issue
Block a user