feat: enviroment variables updates

apps/docs/content/features/env-variables.mdx

@@ -53,26 +53,57 @@ It is always necessary to redeploy your application when updating or creating en
 
 ## Setting secret variables
 
-Use secret variables to store passwords, tokens and other sensitive information that shouldn't be part of your repository and listed in zerops.yml.
+There are several ways to set secret variables to your project/services using Zerops GUI:
+
+### With Import Dialog
+
+When importing services/project using yaml config via Zerops dashboard, you can assign secret variables to your services in your yaml using the `envSecrets` parameter:
+
+```yaml
+services:
+  - hostname: app
+    type: nodejs@latest
+    envSecrets:
+      SECRET_KEY: <@generateRandomString(<32>)>
+      S3_ACCESS_KEY_ID: 'P8cX1vVVb'
+      S3_ACCESS_SECRET: 'ogFthuiLYki8XoL73opSCQ'
+```
+
+### From Project > Services > Secrets
+
+You can assign secret variables to your services from the **Project > Service > Environment variables** page.
+Use secret variables to store tokens and other sensitive information that shouldn't be public and assigned in `zerops.yml`.
 
 <p align="center">
     <Image
-    lightImage="/img/screenshots/runtime_secret_variables.png"
-    darkImage="/img/screenshots/runtime_secret_variables.png"
-    alt="Runtime Secret Variables"
+    lightImage="/img/gui/secrets.webp"
+    darkImage="/img/gui/secrets.webp"
+    alt="Secret Variables"
   />
 </p>
 
-To configure environment variables for an existing service, go to the service detail and find **Environment variables** in the left menu. Click on the **Add secret variable** button and set values for `Key` and `Value`.
+You can add or manage secret variables in your service in two ways:
 
-To edit an environment variable, click on the menu <svg xmlns="http://www.w3.org/2000/svg" style={{ marginBottom: -5 + 'px' }} height="24px" viewBox="0 -960 960 960" width="24px" fill="#e8eaed"><path d="M480-160q-33 0-56.5-23.5T400-240q0-33 23.5-56.5T480-320q33 0 56.5 23.5T560-240q0 33-23.5 56.5T480-160Zm0-240q-33 0-56.5-23.5T400-480q0-33 23.5-56.5T480-560q33 0 56.5 23.5T560-480q0 33-23.5 56.5T480-400Zm0-240q-33 0-56.5-23.5T400-720q0-33 23.5-56.5T480-800q33 0 56.5 23.5T560-720q0 33-23.5 56.5T480-640Z"/></svg> on the right side of its row.
+1. To add a single individual variable, click the `Add secret variable` button and set values for `Key` and `Value`. 
+2. Click `Edit multiple secret variables in .env format` to manage/add multiple variables at once using the editor.
 
-After making changes, click the **Commit x changes** button to apply your updates. Zerops will automatically propagate these changes to the environment variables across all containers in your project's services.
+After you make the changes, Zerops will automatically propagate/commit these changes to the environment variables in your service.
 
 :::note
 It is necessary to restart the service whenever you commit changes in environment variables.
 :::
 
+### Individual editing
+<p align="center">
+    <Image
+    lightImage="/img/gui/env-editing.png"
+    darkImage="/img/gui/env-editing.png"
+    alt="Secret Variables"
+  />
+</p>
+
+To edit an existing variable, click on <svg xmlns="http://www.w3.org/2000/svg" style={{ marginBottom: -5 + 'px' }} height="24px" viewBox="0 -960 960 960" width="24px" className="fill-[#212121] dark:fill-[#e8eaed]"><path d="M480-160q-33 0-56.5-23.5T400-240q0-33 23.5-56.5T480-320q33 0 56.5 23.5T560-240q0 33-23.5 56.5T480-160Zm0-240q-33 0-56.5-23.5T400-480q0-33 23.5-56.5T480-560q33 0 56.5 23.5T560-480q0 33-23.5 56.5T480-400Zm0-240q-33 0-56.5-23.5T400-720q0-33 23.5-56.5T480-800q33 0 56.5 23.5T560-720q0 33-23.5 56.5T480-640Z"/></svg> to open the edit dialog and save your preferred changes.
+
 ## Restrictions
 
 ### Key
@@ -81,11 +112,15 @@ It is necessary to restart the service whenever you commit changes in environmen
 - Keys in the same service must be unique
 - Keys are case-sensitive
 
+eg. `DATABASE_URL`, `NODE_ENV`, etc
+
 ### Value
 
 - Must contain only ASCII characters
 - Any EOL character is forbidden
 
+eg. `postgresql://username:password@host:port/database`, `3000`, etc
+
 These restrictions apply to all [types of environment variables](#types-of-environment-variables).
 
 ## Referencing other environment variables
@@ -141,9 +176,11 @@ run:
 
 ## Generated environment variables
 
-Zerops automatically generates several variables when a runtime service is created, such as `hostname` and `PATH`. Some of these variables (like `hostname`) are read-only, while others (like `PATH`) can be edited. These variables cannot be deleted and are always listed at the bottom of the **Environment Variables** page.
+Zerops automatically generates several variables when a runtime service is created, such as `hostname` and `PATH`. Some of these variables (like `hostname`) are read-only, while others (like `PATH`) can be edited.
+
+These variables cannot be deleted and are always listed at the bottom of the **Environment Variables** page.
 
-## Runetime specific tutorials
+## Runtime specific tutorials
 
 - [Node.js](/nodejs/how-to/env-variables#how-to-read-env-variables-from-your-nodejs-app)
 - [PHP](/php/how-to/env-variables#how-to-read-env-variables-from-your-php-app)

apps/docs/content/java/how-to/env-variables.mdx

@@ -27,6 +27,11 @@ You can [reference](/java/how-to/env-variables#reference-a-local-variable-in-ano
 
 Use secret variables to store passwords, tokens and other sensitive information that shouldn't be part of your repository and listed in zerops.yml.
 
+You can manage secret variables in two ways:
+
+1. **Individual editing**: Add or edit variables one by one
+2. **Bulk editing**: Manage multiple variables at once using .env format
+
 <p align="center">
   <img
     src="/img/screenshots/secret_env.png"
@@ -36,16 +41,29 @@ Use secret variables to store passwords, tokens and other sensitive information
   />
 </p>
 
-You can set env variables when you [create](/java/how-to/create) a new Java service or you can set them later.
+### Individual editing
+
+To configure individual variables, go to the service detail and choose **Environment variables** in the left menu. Click the **Add secret variable** button and set variable key and value.
+
+You can edit or delete variables by clicking on the menu on the right side of each row.
 
-To configure env variables for an existing service, go to the service detail and choose **Environment variables** in the left menu. Scroll to the **Secret variables** section and click on the **Add secret variable** button and set variable key and value.
+### Bulk editing
 
-You can edit or delete env variables that you've created by clicking on the menu on the right side of each row.
+Click "Edit multiple secret variables in .env format" to open an editor where you can manage multiple variables at once using standard .env file format:
+
+```env
+# Add or update variables
+DB_USER=admin
+API_KEY=abc123
+DEBUG_MODE=true
+
+# Delete variables by removing their lines
+```
 
-The changes you've made in the list of env variables need to be committed. Click on the **Commit x changes** button and Zerops will update the env variables in all containers of your project's services.
+Zerops will automatically update the env variables in all containers of your project's services.
 
 :::caution
-You need to **restart** the runtime service after you commit the changes in env variables. The Java process running in the container receives the list env variables only when it starts. Update of the env variables while the Java process is running does not affect your application.
+You need to **restart** the runtime service after updating env variables. The Java process running in the container receives the list env variables only when it starts. Update of the env variables while the Java process is running does not affect your application.
 :::
 
 ## Set basic build env variables in zerops.yml

apps/docs/content/nodejs/how-to/env-variables.mdx

@@ -27,6 +27,11 @@ You can [reference](/nodejs/how-to/env-variables#reference-a-local-variable-in-a
 
 Use secret variables to store passwords, tokens and other sensitive information that shouldn't be part of your repository and listed in zerops.yml.
 
+You can manage secret variables in two ways:
+
+1. **Individual editing**: Add or edit variables one by one
+2. **Bulk editing**: Manage multiple variables at once using .env format
+
 <p align="center">
   <img
     src="/img/screenshots/runtime_secret_variables.png"
@@ -36,17 +41,24 @@ Use secret variables to store passwords, tokens and other sensitive information
   />
 </p>
 
-You can set env variables when you [create](/nodejs/how-to/create) a new Node.js service or you can set them later.
+### Individual editing
 
-To configure env variables for an existing service, go to the service detail and choose **Environment variables** in the left menu. Scroll to the **Secret variables** section and click on the **Add secret variable** button and set variable key and value.
+To configure individual variables, go to the service detail and choose **Environment variables** in the left menu. Click the **Add secret variable** button and set variable key and value.
 
-You can edit or delete env variables that you've created by clicking on the menu on the right side of each row.
+You can edit or delete variables by clicking on the menu on the right side of each row.
 
-The changes you've made in the list of env variables need to be committed. Click on the **Commit x changes** button and Zerops will update the env variables in all containers of your project's services.
+### Bulk editing
 
-:::caution
-You need to **restart** the runtime service after you commit the changes in env variables. The Node.js process running in the container receives the list env variables only when it starts. Update of the env variables while the Node.js process is running does not affect your application.
-:::
+Click "Edit multiple secret variables in .env format" to open an editor where you can manage multiple variables at once using standard .env file format:
+
+```env
+# Add or update variables
+DB_USER=admin
+API_KEY=abc123
+DEBUG_MODE=true
+
+# Delete variables by removing their lines
+```
 
 ## Set basic build env variables in zerops.yml
 
@@ -174,3 +186,24 @@ You can use runtime env variables in the build environment using the `RUNTIME_`
 If you create a secret env variable and a basic runtime env variable with the same key, Zerops saves the basic runtime env variable from your zerops.yml and ignores the secret env variable.
 
 If you create a basic build env variable and a runtime env variable with the same key, Zerops saves both because the build and runtime environments have separate sets of env variables.
+
+## Setting secret variables
+
+You can set secret variables in two ways:
+
+### With Import Dialog 
+
+When importing a Node.js service using YAML configuration, you can define secret variables using the `envSecrets` map:
+
+```yaml
+services:
+  - hostname: app
+    type: nodejs@latest
+    envSecrets:
+      S3_ACCESS_KEY_ID: 'P8cX1vVVb'
+      S3_ACCESS_SECRET: 'ogFthuiLYki8XoL73opSCQ'
+```
+
+### In Zerops GUI
+
+Use secret variables to store passwords, tokens and other sensitive information that shouldn't be part of your repository and listed in zerops.yml.

apps/docs/content/python/how-to/env-variables.mdx

@@ -27,6 +27,11 @@ You can [reference](/python/how-to/env-variables#reference-a-local-variable-in-a
 
 Use secret variables to store passwords, tokens and other sensitive information that shouldn't be part of your repository and listed in zerops.yml.
 
+You can manage secret variables in two ways:
+
+1. **Individual editing**: Add or edit variables one by one
+2. **Bulk editing**: Manage multiple variables at once using .env format
+
 <p align="center">
   <img
     src="/img/screenshots/secret_env.png"
@@ -36,16 +41,28 @@ Use secret variables to store passwords, tokens and other sensitive information
   />
 </p>
 
-You can set env variables when you [create](/python/how-to/create) a new Python service or you can set them later.
+### Individual editing
+
+To configure individual variables, go to the service detail and choose **Environment variables** in the left menu. Click the **Add secret variable** button and set variable key and value.
+
+You can edit or delete variables by clicking on the menu on the right side of each row.
+
+### Bulk editing
+
+Click "Edit multiple secret variables in .env format" to open an editor where you can manage multiple variables at once using standard .env file format:
 
-To configure env variables for an existing service, go to the service detail and choose **Environment variables** in the left menu. Scroll to the **Secret variables** section and click on the **Add secret variable** button and set variable key and value.
+```env
+# Add or update variables
+DB_USER=admin
+API_KEY=abc123
+DEBUG_MODE=true
 
 You can edit or delete env variables that you've created by clicking on the menu on the right side of each row.
 
-The changes you've made in the list of env variables need to be committed. Click on the **Commit x changes** button and Zerops will update the env variables in all containers of your project's services.
+Zerops will automatically update the env variables in all containers of your project's services.
 
 :::caution
-You need to **restart** the runtime service after you commit the changes in env variables. The Python process running in the container receives the list env variables only when it starts. Update of the env variables while the Python process is running does not affect your application.
+You need to **restart** the runtime service after updating env variables. The Python process running in the container receives the list env variables only when it starts. Update of the env variables while the Python process is running does not affect your application.
 :::
 
 ## Set basic build env variables in zerops.yml