feat: add sensitive Declarative setting example

Signed-off-by: Andrey Borysenko <[email protected]>

Author: andrey18106

lib/main.py

@@ -183,6 +183,15 @@ async def lifespan(app: FastAPI):
             default="foo",
             options={_("First radio"): "foo", _("Second radio"): "bar", _("Third radio"): "baz"},
         ),
+        SettingsField(
+            id="test_ex_app_sensitive_field",
+            title=_("Password"),
+            description=_("Set some secure value setting with encryption"),
+            type=SettingsFieldType.PASSWORD,
+            default="",
+            placeholder=_("Set secure value"),
+            sensitive=True,
+        ),
     ],
 )
 
@@ -194,7 +203,10 @@ def enabled_handler(enabled: bool, nc: NextcloudApp) -> str:
             "top_menu",
             "first_menu",
             "ui_example_state",
-            {"initial_value": "test init value"},
+            {
+                "initial_value": "test init value",
+                "initial_sensitive_value": "test_sensitive_value",
+            },
         )
         nc.ui.resources.set_script("top_menu", "first_menu", "js/ui_example-main")
         nc.ui.top_menu.register("first_menu", "UI example", "img/app.svg")
@@ -234,6 +246,8 @@ def enabled_handler(enabled: bool, nc: NextcloudApp) -> str:
             ],
         )
 
+        nc.appconfig_ex.set_value("test_ex_app_sensitive_field", "test_sensitive_value", sensitive=True)
+
         if nc.srv_version["major"] >= 29:
             nc.ui.settings.register_form(SETTINGS_EXAMPLE)
     else:
@@ -247,13 +261,18 @@ def enabled_handler(enabled: bool, nc: NextcloudApp) -> str:
         nc.occ_commands.unregister("ui_example:ping")
         nc.occ_commands.unregister("ui_example:setup")
         nc.occ_commands.unregister("ui_example:stream")
+        nc.appconfig_ex.delete("test_ex_app_sensitive_field")
     return ""
 
 
 class Button1Format(BaseModel):
     initial_value: str
 
 
+class Button2Format(BaseModel):
+    sensitive_value: str
+
+
 @APP.post("/api/verify_initial_value")
 async def verify_initial_value(
     input1: Button1Format,
@@ -263,6 +282,16 @@ async def verify_initial_value(
         content={"initial_value": str(random.randint(0, 100))}, status_code=200
     )
 
+@APP.post("/api/verify_sensitive_value")
+async def verify_sensitive_value(
+    input1: Button2Format,
+    nc: Annotated[NextcloudApp, Depends(nc_app)],
+):
+    print("Old sensitive value: ", input1.sensitive_value)
+    sensitive_value = nc.appconfig_ex.get_value("test_ex_app_sensitive_field")
+    print("Sensitive value: ", sensitive_value)
+    return responses.JSONResponse(content={"sensitive_value": sensitive_value}, status_code=200)
+
 
 @APP.post("/api/test_menu")
 async def test_menu_handler(

src/store/example.js

@@ -37,6 +37,22 @@ const actions = {
 			})
 	},
 
+	verifySensitiveValue(context, value) {
+		axios.post(generateUrl(`${APP_API_PROXY_URL_PREFIX}/${EX_APP_ID}/api/verify_sensitive_value`), {
+			sensitive_value: value,
+		})
+			.then((res) => {
+				if ('sensitive_value' in res.data && res.data.sensitive_value === value) {
+					showSuccess(t('ui_example', 'Sensitive value is correct'))
+				} else {
+					showError(t('ui_example', 'Sensitive value is incorrect'))
+				}
+			})
+			.catch(() => {
+				showError(t('ui_example', 'Sensitive value is incorrect'))
+			})
+	},
+
 	sendNextcloudFileToExApp(context, fileInfo) {
 		axios.post(generateUrl(`${APP_API_PROXY_URL_PREFIX}/${EX_APP_ID}/api/nextcloud_file`), {
 			file_info: fileInfo,

src/views/ExAppView.vue

@@ -12,6 +12,14 @@
 				<NcButton @click="verifyInitialValue">
 					{{ t('ui_example', 'Verify initial value') }}
 				</NcButton>
+
+				<div style="margin: 10px 0; display: flex; align-items: center; width: 100%; justify-content: center; flex-direction: column;">
+					<NcInputField :value.sync="initialState.initial_sensitive_value"
+						:label="t('ui_example', 'Test sensitive value')" />
+					<NcButton style="margin: 10px 0;" @click="verifySensitiveValue">
+						{{ t('ui_example', 'Verify sensitive value') }}
+					</NcButton>
+				</div>
 			</div>
 		</NcAppContent>
 	</NcContent>
@@ -48,6 +56,9 @@ export default {
 		verifyInitialValue() {
 			this.$store.dispatch('verifyInitialStateValue', this.initialState?.initial_value)
 		},
+		verifySensitiveValue() {
+			this.$store.dispatch('verifySensitiveValue', this.initialState?.initial_sensitive_value)
+		},
 	},
 }
 </script>