1
0
Fork 0
mirror of synced 2024-07-20 22:06:15 +12:00
appwrite/app/views/console/functions/function.phtml
Steven Nguyen 8b0aa634ec Hide function stdout from console
Because it's possible for execution stdout to end up in the wrong
execution, we're going to hide the result from the UI to help avoid
confusion for users while we work on resolving the problem.
2022-09-13 17:01:41 +00:00

922 lines
61 KiB
PHTML

<?php
$fileLimit = $this->getParam('fileLimit', 0);
$fileLimitHuman = $this->getParam('fileLimitHuman', 0);
$events = $this->getParam('events', []);
$timeout = $this->getParam('timeout', 900);
$usageStatsEnabled = $this->getParam('usageStatsEnabled', true);
$patterns = [
'documents',
'documents.create',
'documents.update',
'documents.delete',
];
foreach ($events as $name => $event) {
$patterns[] = $name;
foreach ($event as $key => $value) {
if (!\str_starts_with($key, '$')) {
if (!($value['$resource'] ?? false)) {
$patterns[] = "{$name}.{$key}";
} else {
$patterns[] = $key;
foreach ($value as $key2 => $value2) {
if (!\str_starts_with($key2, '$')) {
if (!($value2['$resource'] ?? false)) {
$patterns[] = "{$key}.{$key2}";
}
}
}
}
}
}
}
sort($patterns);
?>
<div
data-service="functions.get"
data-name="project-function"
data-event="load,functions.update,functions.createDeployment,functions.updateDeployment,functions.deleteDeployment,functions.retryBuild"
data-param-function-id="{{router.params.id}}"
data-success="trigger"
data-success-param-trigger-events="functions.get">
<div class="cover">
<h1 class="zone xl margin-bottom-large">
<a data-ls-attrs="href=/console/functions?project={{router.params.project}}" class="back text-size-small link-return-animation--start"><i class="icon-left-open"></i> Functions</a>
<br />
<span data-ls-bind="{{project-function.name}}&nbsp;">&nbsp;</span>
</h1>
</div>
<div data-ui-modal class="modal width-large box close" data-button-hide="on" data-open-event="open-json">
<button type="button" class="close pull-end" data-ui-modal-close=""><i class="icon-cancel"></i></button>
<h2>JSON View</h2>
<div class="margin-bottom">
<input type="hidden" data-ls-bind="{{project-function}}" data-forms-code />
</div>
<button data-ui-modal-close="" type="button" class="reverse">Cancel</button>
</div>
<div class="zone xl">
<ul class="phases clear" data-ui-phases data-selected="{{router.params.tab}}">
<li data-state="/console/functions/function?id={{router.params.id}}&project={{router.params.project}}">
<h2>Overview</h2>
<div class="row responsive margin-top-negative">
<div class="col span-8 margin-bottom">
<label>&nbsp;</label>
<div class="box margin-bottom-large">
<div class="text-align-center">
<img src="" data-ls-attrs="src=/images/runtimes/{{project-function.runtime|runtimeLogo}}" alt="Function Runtime" class="avatar huge margin-top-negative-xxl" />
<p class="text-fade margin-bottom-small" data-ls-bind="{{project-function.runtime|runtimeName}} {{project-function.runtime|runtimeVersion}}">
</p>
<div data-ls-if="{{project-function.deployment}} !== ''" class="margin-top">
<button data-ls-ui-trigger="execute-now">Execute Now</button> &nbsp; <a data-ls-attrs="href=/console/functions/function/logs?id={{router.params.id}}&project={{router.params.project}}" class="button reverse" style="vertical-align: top;">View Logs</a>
</div>
</div>
</div>
<div class="margin-bottom"
data-service="functions.listDeployments"
data-scope="sdk"
data-event="load,functions.createDeployment,functions.deleteDeployment,functions.updateDeployment,functions.retryBuild"
data-name="project-function-deployments"
data-param-function-id="{{router.params.id}}"
data-param-queries="limit(<?php echo APP_PAGING_LIMIT; ?>),offset({{router.params.offset|orZero}}),orderDesc('')"
data-param-queries-cast-to="array"
data-param-queries-cast-from="csv"
data-success="trigger"
data-success-param-trigger-events="functions.listDeployments">
<h3>Deployments <span class="text-fade text-size-small pull-end margin-top-small" data-ls-bind="{{project-function-deployments.total}} deployments found"></span></h3>
<div data-ls-if="0 == {{project-function-deployments.deployments.length}} || undefined == {{project-function-deployments.deployments.length}}" class="box margin-top margin-bottom">
<h3 class="margin-bottom-small text-bold">No Deployments Found</h3>
<p class="margin-bottom-no">You haven't deployed any deployments for your function yet.</p>
</div>
<div data-ls-if="(0 != {{project-function-deployments.deployments.length}}) && (undefined !== {{project-function-deployments.deployments.length}})">
<div class="box margin-bottom">
<ul data-ls-loop="project-function-deployments.deployments" data-ls-as="deployment" class="list">
<li class="clear">
<div data-ui-modal class="modal width-large box close" data-button-hide="on" data-open-event="open-stderr-{{deployment.$id}}">
<button type="button" class="close pull-end" data-ui-modal-close=""><i class="icon-cancel"></i></button>
<h2>Build Error Log</h2>
<div class="margin-bottom">
<input type="hidden" data-ls-bind="{{deployment.buildStderr}}" data-forms-code="bash" data-lang="bash" data-lang-label="Bash" />
</div>
<button data-ui-modal-close="" type="button" class="reverse">Cancel</button>
</div>
<div data-ui-modal class="modal width-large box close" data-button-hide="on" data-open-event="open-stdout-{{deployment.$id}}">
<button type="button" class="close pull-end" data-ui-modal-close=""><i class="icon-cancel"></i></button>
<h2>Build Log</h2>
<div class="margin-bottom">
<input type="hidden" data-ls-bind="{{deployment.buildStdout}}" data-forms-code="bash" data-lang="bash" data-lang-label="Bash" />
</div>
<button data-ui-modal-close="" type="button" class="reverse">Cancel</button>
</div>
<form data-ls-if="({{deployment.$id}} !== {{project-function.deployment}} && {{deployment.status}} == 'ready')" name="functions.updateDeployment" class="pull-end"
data-analytics
data-analytics-activity
data-analytics-event="submit"
data-analytics-category="console"
data-analytics-label="Create Function Execution"
data-service="functions.updateDeployment"
data-event="submit"
data-param-function-id="{{router.params.id}}"
data-success="alert,trigger"
data-success-param-alert-text="Deployment updated successfully"
data-success-param-trigger-events="functions.updateDeployment"
data-failure="alert"
data-failure-param-alert-text="Failed to update deployment"
data-failure-param-alert-classname="error">
<input type="hidden" name="deploymentId" data-ls-bind="{{deployment.$id}}">
<button>Activate</button>
</form>
<form data-ls-if="({{deployment.$id}} !== {{project-function.deployment}} && {{deployment.status}} == 'failed')" name="functions.retryBuild" class="pull-end"
data-analytics
data-analytics-activity
data-analytics-event="submit"
data-analytics-category="console"
data-analytics-label="Retry Build"
data-service="functions.retryBuild"
data-event="submit"
data-success="alert,trigger"
data-success-param-alert-text="Build started successfully"
data-success-param-trigger-events="functions.retryBuild"
data-failure="alert"
data-failure-param-alert-text="Failed to retry build"
data-failure-param-alert-classname="error">
<input type="hidden" name="buildId" data-ls-bind="{{deployment.buildId}}">
<input type="hidden" name="functionId" data-ls-bind="{{router.params.id}}">
<input type="hidden" name="deploymentId" data-ls-bind="{{deployment.$id}}">
<button>Retry Build</button>
</form>
<b data-ls-bind="{{deployment.$id}}"></b> &nbsp;
<span class="text-fade" data-ls-bind="{{deployment.entrypoint}}"></span>
<div class="text-size-small margin-top-small clear">
<span data-ls-if="{{deployment.status}} == 'failed'" style="color: var(--config-color-danger)" class="pull-start" data-ls-bind="{{deployment.status}}"></span>
<span data-ls-if="{{deployment.status}} == 'ready'" style="color: var(--config-color-success)" class="pull-start" data-ls-bind="{{deployment.status}}"></span>
<span data-ls-if="{{deployment.status}} == 'processing' || {{deployment.status}} == 'building'" style="color: var(--config-color-info)" class="pull-start" data-ls-bind="{{deployment.status}}"></span>
<span class="pull-start" data-ls-bind="&nbsp; | &nbsp; Created {{deployment.$createdAt|timeSince}} &nbsp; | &nbsp; {{deployment.size|humanFileSize}}{{deployment.size|humanFileUnit}}"></span>
<span data-ls-if="{{deployment.status}} == 'failed'">&nbsp; | &nbsp;<button type="button" class="link text-size-small" data-ls-ui-trigger="open-stderr-{{deployment.$id}}">Logs</button></span>
<span data-ls-if="{{deployment.status}} == 'ready'">&nbsp; | &nbsp;<button type="button" class="link text-size-small" data-ls-ui-trigger="open-stdout-{{deployment.$id}}">Logs</button></span>
<form data-ls-if="{{deployment.$id}} !== {{project-function.deployment}}" name="functions.deleteDeployment" class="pull-start"
data-analytics
data-analytics-activity
data-analytics-event="submit"
data-analytics-category="console"
data-analytics-label="Delete Function Deployment"
data-service="functions.deleteDeployment"
data-event="submit"
data-param-function-id="{{router.params.id}}"
data-confirm="Are you sure you want to delete this function deployment?"
data-success="alert,trigger"
data-success-param-alert-text="Function deployment deleted successfully"
data-success-param-trigger-events="functions.deleteDeployment"
data-failure="alert"
data-failure-param-alert-text="Failed to delete function deployment"
data-failure-param-alert-classname="error">
<input type="hidden" name="deploymentId" data-ls-bind="{{deployment.$id}}" />
&nbsp; | &nbsp;<button type="submit" class="link text-danger text-size-small">Delete</button>
</form>
</div>
</li>
</ul>
</div>
</div>
</div>
<div class="pull-start">
<button data-ls-ui-trigger="create-deployment">Create Deployment</button>
</div>
<div class="pull-end paging">
<form
data-service="functions.listDeployments"
data-event="submit"
data-param-function-id="{{router.params.id}}"
data-param-search="{{router.params.search}}"
data-scope="sdk"
data-name="project-function-deployments"
data-success="state"
data-success-param-state-keys="search,offset">
<input type="hidden" name="offset">
<button name="queries" data-cast-to="array" data-cast-from="csv" data-paging-back data-paging-desc data-offset="{{router.params.offset}}" data-total="{{project-function-deployments.total}}" class="margin-end round small" aria-label="Back"><i class="icon-left-open"></i></button>
</form>
<span data-ls-bind="{{router.params.offset|pageCurrent}} / {{project-function-deployments.total|pageTotal}}"></span>
<form
data-service="functions.listDeployments"
data-event="submit"
data-param-function-id="{{router.params.id}}"
data-param-search="{{router.params.search}}"
data-scope="sdk"
data-name="project-function-deployments"
data-success="state"
data-success-param-state-keys="search,offset">
<input type="hidden" name="offset">
<button name="queries" data-cast-to="array" data-cast-from="csv" data-paging-next data-paging-desc data-offset="{{router.params.offset}}" data-total="{{project-function-deployments.total}}" class="margin-start round small" aria-label="Next"><i class="icon-right-open"></i></button>
</form>
</div>
</div>
<div class="col span-4 sticky-top margin-bottom">
<label>Function ID</label>
<div class="input-copy margin-bottom">
<input id="uid" type="text" autocomplete="off" placeholder="" data-ls-bind="{{project-function.$id}}" disabled data-forms-copy>
</div>
<ul class="margin-bottom-large text-fade text-size-small">
<li class="margin-bottom-small"><i class="icon-angle-circled-right margin-start-tiny margin-end-tiny"></i>
<button data-ls-ui-trigger="open-json"
class="link text-size-small"
data-analytics
data-analytics-event="click"
data-analytics-category="console"
data-analytics-label="View as JSON (Function)">
View as JSON
</button>
</li>
<li class="margin-bottom-small"><i class="icon-angle-circled-right margin-start-tiny margin-end-tiny"></i> Last Updated: <span data-ls-bind="{{project-function.$updatedAt|date}}"></span></li>
<li class="margin-bottom-small"><i class="icon-angle-circled-right margin-start-tiny margin-end-tiny"></i> Created: <span data-ls-bind="{{project-function.$createdAt|date}}"></span></li>
</ul>
<form name="functions.delete" class="margin-bottom"
data-analytics
data-analytics-activity
data-analytics-event="submit"
data-analytics-category="console"
data-analytics-label="Delete Function"
data-service="functions.delete"
data-event="submit"
data-param-function-id="{{router.params.id}}"
data-confirm="Are you sure you want to delete this function?"
data-success="alert,trigger,redirect"
data-success-param-alert-text="Function deleted successfully"
data-success-param-trigger-events="functions.delete"
data-success-param-redirect-url="/console/functions?project={{router.params.project}}"
data-failure="alert"
data-failure-param-alert-text="Failed to delete function"
data-failure-param-alert-classname="error">
<button type="submit" class="danger fill">Delete Function</button>
</form>
</div>
</div>
</li>
<?php if ($usageStatsEnabled): ?>
<li data-state="/console/functions/function/monitors?id={{router.params.id}}&project={{router.params.project}}">
<form class="pull-end margin-start-small margin-top-small" data-ls-if="{{usage.range}} !== '90d'"
data-service="functions.getFunctionUsage"
data-event="submit"
data-name="usage"
data-param-function-id="{{router.params.id}}"
data-param-range="90d">
<button class="tick">90d</button>
</form>
<button class="tick pull-end margin-start-small margin-top-small" data-ls-if="{{usage.range}} === '90d'" disabled>90d</button>
<form class="pull-end margin-start-small margin-top-small" data-ls-if="{{usage.range}} !== '30d'"
data-service="functions.getFunctionUsage"
data-event="submit"
data-name="usage"
data-param-range="30d"
data-param-function-id="{{router.params.id}}">
<button class="tick">30d</button>
</form>
<button class="tick pull-end margin-start-small margin-top-small" data-ls-if="{{usage.range}} === '30d'" disabled>30d</button>
<form class="pull-end margin-start-small margin-top-small" data-ls-if="{{usage.range}} !== '24h'"
data-service="functions.getFunctionUsage"
data-event="submit"
data-name="usage"
data-param-function-id="{{router.params.id}}"
data-param-range="24h">
<button class="tick">24h</button>
</form>
<button class="tick pull-end margin-start-small margin-top-small" data-ls-if="{{usage.range}} === '24h'" disabled>24h</button>
<h2>Monitors</h2>
<div
data-service="functions.getFunctionUsage"
data-event="load"
data-name="usage"
data-param-function-id="{{router.params.id}}">
<div class="box margin-bottom-small">
<div class="margin-start-negative-small margin-end-negative-small margin-top-negative-small margin-bottom-negative-small">
<div class="chart background-image-no border-no margin-bottom-no">
<input type="hidden" data-ls-bind="{{usage}}" data-forms-chart="Executions=executionsTotal" data-height="140" data-show-y-axis="true" />
</div>
</div>
</div>
<ul class="chart-notes margin-bottom-large">
<li>Executions <span data-ls-bind="({{usage.executionsTotal|statsGetLast|statsTotal}})"></span></li>
</ul>
<div class="box margin-bottom-small">
<div class="margin-start-negative-small margin-end-negative-small margin-top-negative-small margin-bottom-negative-small">
<div class="chart background-image-no border-no margin-bottom-no">
<input type="hidden" data-ls-bind="{{usage}}" data-forms-chart="CPU Time (milliseconds)=executionsTime" data-colors="orange" data-height="140" data-show-y-axis="true" />
</div>
</div>
</div>
<ul class="chart-notes margin-bottom-large">
<li class="orange">CPU Time <span data-ls-bind="({{usage.executionsTime|statsGetLast|ms2hum}})"></span></li>
</ul>
<div class="box margin-bottom-small">
<div class="margin-start-negative-small margin-end-negative-small margin-top-negative-small margin-bottom-negative-small">
<div class="chart background-image-no border-no margin-bottom-no">
<input type="hidden" data-ls-bind="{{usage}}" data-forms-chart="Failures=executionsFailure" data-colors="red" data-height="140" data-show-y-axis="true" />
</div>
</div>
</div>
<ul class="chart-notes margin-bottom-large">
<li class="red">Errors <span data-ls-bind="({{usage.executionsFailure|statsGetLast|statsTotal}})"></span></li>
</ul>
</div>
</li>
<?php endif;?>
<li data-state="/console/functions/function/logs?id={{router.params.id}}&project={{router.params.project}}">
<div class="text-fade text-size-small pull-end margin-top" data-ls-bind="{{project-function-executions.total}} executions found"></div>
<h2>Logs</h2>
<div
data-service="functions.listExecutions"
data-scope="sdk"
data-event="load,functions.createExecution"
data-name="project-function-executions"
data-param-function-id="{{router.params.id}}"
data-param-queries="limit(<?php echo APP_PAGING_LIMIT; ?>),offset({{router.params.offset|orZero}}),orderDesc('')"
data-param-queries-cast-to="array"
data-param-queries-cast-from="csv"
data-success="trigger"
data-success-param-trigger-events="functions.listExecutions">
<div data-ls-if="0 < {{project-function-executions.executions.length}} && undefined !== {{project-function-executions.executions}}">
<div class="box margin-bottom">
<table class="vertical small">
<thead>
<tr>
<th width="30"></th>
<th width="160">Created</th>
<th width="150">Status</th>
<th width="120">Trigger</th>
<th width="80">Runtime</th>
<th width=""></th>
</tr>
</thead>
<tbody data-ls-loop="project-function-executions.executions" data-ls-as="execution">
<tr>
<td data-title="">
<i class="dot danger" data-ls-if="{{execution.status}} === 'failed'"></i>
<i class="dot info" data-ls-if="{{execution.status}} === 'waiting'"></i>
<i class="dot info" data-ls-if="{{execution.status}} === 'processing'"></i>
<i class="dot success" data-ls-if="{{execution.status}} === 'completed'"></i>
</td>
<td data-title="Date: ">
<span data-ls-bind="{{execution.$createdAt|dateTime}}"></span>
</td>
<td data-title="Status: ">
<span data-ls-bind="{{execution.status}}"></span>
<span class="text-fade text-size-small" data-ls-if="{{execution.statusCode}} < 200 && {{execution.statusCode}} >= 300" data-ls-bind=" exit code: {{execution.statusCode}}"></span>
</td>
<td data-title="Trigger: ">
<span data-ls-bind="{{execution.trigger}}"></span>
</td>
<td data-title="Time: ">
<span data-ls-if="{{execution.status}} === 'completed' || {{execution.status}} === 'failed'" data-ls-bind="{{execution.duration|seconds2hum}}"></span>
<span data-ls-if="{{execution.status}} === 'waiting' || {{execution.status}} === 'processing'">-</span>
</td>
<td data-title="">
<div data-ls-if="{{execution.status}} === 'completed' || {{execution.status}} === 'failed'" data-title="" style="display: flex;">
<button class="desktops-only pull-end link margin-start text-danger" data-ls-ui-trigger="execution-stderr-{{execution.$id}}">Stderr</button>
<!--button class="desktops-only pull-end link margin-start" data-ls-ui-trigger="execution-stdout-{{execution.$id}}">Stdout</button-->
<button class="desktops-only pull-end link margin-start" data-ls-ui-trigger="execution-response-{{execution.$id}}">Response</button>
<button class="phones-only-inline tablets-only-inline link margin-end-small" data-ls-ui-trigger="execution-response-{{execution.$id}}">Response</button>
<!--button class="phones-only-inline tablets-only-inline link margin-end-small" data-ls-ui-trigger="execution-stdout-{{execution.$id}}">Stdout</button-->
<button class="phones-only-inline tablets-only-inline link text-danger" data-ls-ui-trigger="execution-stderr-{{execution.$id}}">Stderr</button>
<div data-ui-modal class="modal width-large box close" data-button-alias="none" data-open-event="execution-response-{{execution.$id}}">
<button type="button" class="close pull-end" data-ui-modal-close=""><i class="icon-cancel"></i></button>
<h1>RESPONSE</h1>
<div class="margin-bottom ide" data-ls-if="({{execution.response.length}})">
<pre data-ls-bind="{{execution.response}}"></pre>
</div>
<div class="margin-bottom" data-ls-if="(!{{execution.response.length}})">
<p>No Response was logged.</p>
</div>
</div>
<div data-ui-modal class="modal width-large box close" data-button-alias="none" data-open-event="execution-stdout-{{execution.$id}}">
<button type="button" class="close pull-end" data-ui-modal-close=""><i class="icon-cancel"></i></button>
<h1>STDOUT</h1>
<div class="margin-bottom ide" data-ls-if="({{execution.stdout.length}})">
<pre data-ls-bind="{{execution.stdout}}"></pre>
</div>
<div class="margin-bottom" data-ls-if="(!{{execution.stdout.length}})">
<p>No output was logged.</p>
</div>
</div>
<div data-ui-modal class="modal width-large box close" data-button-alias="none" data-open-event="execution-stderr-{{execution.$id}}">
<button type="button" class="close pull-end" data-ui-modal-close=""><i class="icon-cancel"></i></button>
<h1>STDERR</h1>
<div class="margin-bottom ide" data-ls-if="({{execution.stderr.length}})">
<pre data-ls-bind="{{execution.stderr}}"></pre>
<!-- <input type="hidden" data-ls-bind="{{execution.stderr}}" data-forms-code="bash" /> -->
</div>
<div class="margin-bottom" data-ls-if="(!{{execution.stderr.length}})">
<p>No errors were logged.</p>
</div>
</div>
</div>
</td>
</tr>
</tbody>
</table>
</div>
<div class="text-align-center paging">
<form
data-service="functions.listExecutions"
data-event="submit"
data-param-function-id="{{router.params.id}}"
data-param-search="{{router.params.search}}"
data-scope="sdk"
data-name="project-function-executions"
data-success="state"
data-success-param-state-keys="search,offset">
<input type="hidden" name="offset">
<button name="queries" data-cast-to="array" data-cast-from="csv" data-paging-back data-paging-desc data-offset="{{router.params.offset}}" data-total="{{project-function-executions.total}}" class="margin-end round small" aria-label="Back"><i class="icon-left-open"></i></button>
</form>
<span data-ls-bind="{{router.params.offset|pageCurrent}} / {{project-function-executions.total|pageTotal}}"></span>
<form
data-service="functions.listExecutions"
data-event="submit"
data-param-function-id="{{router.params.id}}"
data-param-search="{{router.params.search}}"
data-scope="sdk"
data-name="project-function-executions"
data-success="state"
data-success-param-state-keys="search,offset">
<input type="hidden" name="offset">
<button name="queries" data-cast-to="array" data-cast-from="csv" data-paging-next data-paging-desc data-offset="{{router.params.offset}}" data-total="{{project-function-executions.total}}" class="margin-start round small" aria-label="Next"><i class="icon-right-open"></i></button>
</form>
</div>
</div>
<div data-ls-if="(!{{project-function-executions.executions.length}})" class="box dashboard margin-bottom">
<div class="margin-bottom-small margin-top-small margin-end margin-start">
<h3 class="margin-bottom-small text-bold">No Logs Founds</h3>
<p class="margin-bottom-no">Execute your function to view execution logs.</p>
</div>
</div>
</div>
</li>
<li data-state="/console/functions/function/variables?id={{router.params.id}}&project={{router.params.project}}">
<h2
data-service="functions.listVariables"
data-event="load,project.update,functions.createVariable,functions.updateVariable,functions.deleteVariable"
data-name="function-variables"
data-param-queries="limit(100)"
data-param-queries-cast-to="array" data-param-queries-cast-from="csv"
data-param-function-id="{{router.params.id}}"
data-scope="sdk">Variables</h2>
<div class="box margin-bottom" data-ls-if="0 < {{function-variables.variables.length}} && undefined !== {{function-variables.variables}}">
<ul data-ls-loop="function-variables.variables" data-ls-as="variable" class="list">
<li class="clear">
<div class="pull-end desktops-only">
<button data-ls-ui-trigger="variable-delete-{{variable.$id}}" class="reverse danger margin-end-small">Delete</button>
<button data-ls-ui-trigger="variable-update-{{variable.$id}}">Update</button>
</div>
<div data-ui-modal data-button-hide="on" data-open-event="variable-update-{{variable.$id}}">
<button type="button" class="close pull-end" data-ui-modal-close=""><i class="icon-cancel"></i></button>
<h1>Update Variable</h1>
<form
data-analytics
data-analytics-activity
data-analytics-event="submit"
data-analytics-category="sdk"
data-analytics-label="Update Function Variable"
data-service="functions.updateVariable"
data-scope="sdk"
data-event="submit"
data-success="alert,trigger"
data-success-param-alert-text="Updated variable successfully"
data-success-param-trigger-events="functions.updateVariable"
data-failure="alert,trigger"
data-failure-param-trigger-events="functions.updateVariable"
data-failure-param-alert-text="Failed to update variable"
data-failure-param-alert-classname="error">
<input type="hidden" name="functionId" data-ls-bind="{{router.params.id}}" />
<input type="hidden" name="variableId" data-ls-bind="{{variable.$id}}" />
<label for="name">Name <span class="tooltip large" data-tooltip="The name of the environment variable you want to set"><i class="icon-question"></i></span></label>
<input type="text" class="full-width" name="key" required autocomplete="off" placeholder="APP_ENV" maxlength="128" data-ls-attrs="id=key-{{variable.$id}}" data-ls-bind="{{variable.key}}" />
<label for="key">Value <span class="tooltip large" data-tooltip="The value of your environment variable"><i class="icon-question"></i></span></label>
<input type="text" class="full-width" name="value" required autocomplete="off" placeholder="Production" data-ls-attrs="id=value-{{variable.$id}}}" data-ls-bind="{{variable.value}}" />
<hr />
<button type="submit">Update</button> &nbsp; <button data-ls-ui-trigger="modal-close" type="button" class="reverse">Cancel</button>
</form>
</div>
<form class="pull-end margin-end"
data-analytics
data-analytics-activity
data-analytics-event="submit"
data-analytics-category="console"
data-analytics-label="Delete Function Variable"
data-service="functions.deleteVariable"
data-scope="sdk"
data-event="variable-delete-{{variable.$id}}"
data-confirm="Are you sure you want to delete this variable?"
data-success="alert,trigger"
data-success-param-alert-text="Deleted variable successfully"
data-success-param-trigger-events="functions.deleteVariable"
data-failure="alert"
data-failure-param-alert-text="Failed to delete variable"
data-failure-param-alert-classname="error">
<input type="hidden" name="functionId" data-ls-bind="{{router.params.id}}" />
<input type="hidden" name="variableId" data-ls-bind="{{variable.$id}}" />
</form>
<div>
<span data-ls-bind="{{variable.key}}"></span>
</div>
<div data-ui-modal class="modal box close" data-button-text="Show Value" data-button-class="link pull-start margin-end-small margin-top-tiny">
<button type="button" class="close pull-end" data-ui-modal-close=""><i class="icon-cancel"></i></button>
<h1>Variable Value</h1>
<form>
<div class="input-copy">
<textarea disabled data-forms-copy data-ls-bind="{{variable.value}}"></textarea>
</div>
<hr />
<div>
<button data-ui-modal-close="" type="button" class="reverse">Cancel</button>
</div>
</form>
</div>
<div class="phones-only-inline tablets-only-inline margin-top-small">
<button class="link" data-ls-ui-trigger="variable-update-{{variable.$id}}">Update</button>
<button class="link danger" data-ls-ui-trigger="variable-delete-{{variable.$id}}">Delete</button>
</div>
</li>
</ul>
</div>
<div data-ls-if="(!{{function-variables.variables.length}})" class="box dashboard margin-bottom">
<div class="margin-bottom-small margin-top-small margin-end margin-start">
<h3 class="margin-bottom-small text-bold">There are currently no variables</h3>
<p class="margin-bottom-no">Add your first variable to store information securely.</p>
</div>
</div>
<div data-ui-modal class="modal box close" data-button-alias=".variable-new">
<button type="button" class="close pull-end" data-ui-modal-close=""><i class="icon-cancel"></i></button>
<h1>Create a new variable</h1>
<form
data-analytics
data-analytics-activity
data-analytics-event="submit"
data-analytics-category="console"
data-analytics-label="Create New Function Variable"
data-service="functions.createVariable"
data-event="submit"
data-success="alert,trigger,reset"
data-success-param-alert-text="Registered new variable successfully"
data-success-param-trigger-events="functions.createVariable"
data-failure="alert"
data-failure-param-alert-text="Failed to register variable"
data-failure-param-alert-classname="error">
<input type="hidden" name="functionId" data-ls-bind="{{router.params.id}}" />
<label for="name">Name <span class="tooltip large" data-tooltip="The name of the environment variable you want to set"><i class="icon-question"></i></span></label>
<input type="text" class="full-width" name="key" required autocomplete="off" placeholder="APP_ENV" maxlength="128" />
<label for="key">Value <span class="tooltip large" data-tooltip="The value of your environment variable"><i class="icon-question"></i></span></label>
<input type="text" class="full-width" name="value" required autocomplete="off" placeholder="Production" />
<hr />
<button type="submit">Create</button> &nbsp; <button data-ui-modal-close="" type="button" class="reverse">Cancel</button>
</form>
</div>
<div class="pull-start link variable-new" data-ls-ui-open="" data-button-aria="Add Variable" data-button-text="Add Variable" data-button-class="button" data-blur="1">
</div>
</li>
<li data-state="/console/functions/function/settings?id={{router.params.id}}&project={{router.params.project}}" x-data="events">
<h2>Settings</h2>
<div class="row responsive margin-top-negative">
<div class="col span-8 margin-bottom">
<label>&nbsp;</label>
<form
data-analytics
data-analytics-activity
data-analytics-event="submit"
data-analytics-category="console"
data-analytics-label="Update Function"
data-service="functions.update"
data-scope="sdk"
data-event="submit"
data-param-function-id="{{router.params.id}}"
data-success="alert,trigger"
data-success-param-alert-text="Updated function successfully"
data-success-param-trigger-events="functions.update"
data-failure="alert"
data-failure-param-alert-text="Failed to update function"
data-failure-param-alert-classname="error">
<div class="box">
<section class="margin-bottom-large">
<label for="name">Name</label>
<input name="name" id="function-name" type="text" autocomplete="off" data-ls-bind="{{project-function.name}}" data-forms-text-direction required placeholder="Function Name" maxlength="128" />
<label for="execute">Execute Access <span class="tooltip small" data-tooltip="Choose who can execute this function using the client API."><i class="icon-info-circled"></i></span> <span class="text-size-small">(<a data-ls-attrs="href={{env.HOME}}/docs/permissions" target="_blank" rel="noopener">Learn more</a>)</span></label>
<input type="hidden" id="execute" name="execute" data-forms-tags data-cast-to="json" data-ls-bind="{{project-function.execute}}" placeholder="User ID, Team ID or Role" />
<div class="text-fade text-size-xs margin-top-negative-small margin-bottom">Add 'any' for wildcard access</div>
<label for="timeout">Timeout (seconds) <span class="tooltip small" data-tooltip="Limit the execution time of your function."><i class="icon-info-circled"></i></span></label>
<input name="timeout" id="function-timeout" type="number" autocomplete="off" data-ls-bind="{{project-function.timeout}}" min="1" max="<?php echo $this->escape($timeout); ?>" data-cast-to="integer" />
<div class="text-size-small text-fade margin-bottom margin-top-negative-small">Max value is <?php echo $this->escape(number_format($timeout)); ?> seconds (<?php echo $this->escape((int) ($timeout / 60)); ?> minutes)</div>
</section>
<section class="margin-bottom-small" data-ls-attrs="x-init=load({{project-function.events}})">
<label class="margin-bottom-small">Events <span class="tooltip small" data-tooltip="Set events that will trigger your function."><i class="icon-info-circled"></i></span></label>
<div>
<template x-for="event in Array.from(events)">
<div class="row events responsive thin margin-bottom-small">
<div class="col span-12 margin-bottom-small">
<span class="text" x-text="event"></span>
<span class="action" @click="removeEvent(event)">
<i class="icon-trash"></i>
</span>
</div>
<input name="events" data-cast-to="array" type="hidden" :value="event"></input>
</div>
</template>
</div>
<button class="margin-end margin-bottom-small reverse" type="button" @click="showModal($refs.modal_function)">Add Event</button>
</section>
<label for="schedule">Schedule (CRON Syntax) <span class="tooltip small" data-tooltip="Set a CRON schedule to trigger this function."><i class="icon-info-circled"></i></span></label>
<input type="text" id="function-schedule" class="full-width" name="schedule" autocomplete="off" data-ls-bind="{{project-function.schedule}}" placeholder="* * * * *" />
<div class="text-size-small text-fade margin-bottom margin-top-negative-small">Leave blank for no schedule</div>
<hr class="margin-bottom margin-top-small" />
<button>Update</button>
</div>
</form>
</div>
<div class="col span-4 sticky-top">
<label>Function ID</label>
<div class="input-copy margin-bottom">
<input id="uid" type="text" autocomplete="off" placeholder="" data-ls-bind="{{project-function.$id}}" disabled data-forms-copy>
</div>
<ul class="margin-bottom-large text-fade text-size-small">
<li class="margin-bottom-small"><i class="icon-angle-circled-right margin-start-tiny margin-end-tiny"></i>
<button data-ls-ui-trigger="open-json"
class="link text-size-small"
data-analytics
data-analytics-event="click"
data-analytics-category="console"
data-analytics-label="View as JSON (Function)">
View as JSON
</button>
</li>
<li class="margin-bottom-small"><i class="icon-angle-circled-right margin-start-tiny margin-end-tiny"></i> Last Updated: <span data-ls-bind="{{project-function.$updatedAt|date}}"></span></li>
<li class="margin-bottom-small"><i class="icon-angle-circled-right margin-start-tiny margin-end-tiny"></i> Created: <span data-ls-bind="{{project-function.$createdAt|date}}"></span></li>
</ul>
<form name="functions.delete" class="margin-bottom"
data-analytics
data-analytics-activity
data-analytics-event="submit"
data-analytics-category="console"
data-analytics-label="Delete Function"
data-service="functions.delete"
data-event="submit"
data-param-function-id="{{router.params.id}}"
data-confirm="Are you sure you want to delete this function?"
data-success="alert,trigger,redirect"
data-success-param-alert-text="Function deleted successfully"
data-success-param-trigger-events="functions.delete"
data-success-param-redirect-url="/console/functions?project={{router.params.project}}"
data-failure="alert"
data-failure-param-alert-text="Failed to delete function"
data-failure-param-alert-classname="error">
<button type="submit" class="danger fill">Delete Function</button>
</form>
</div>
</div>
<div x-ref="modal_function" data-ui-modal class="modal box close width-small height-small" data-button-hide="on">
<div>
<form @submit.prevent="addEvent($refs.modal_function)">
<label for="event">
Event
</label>
<select id="event" x-model="selected" @change="setEvent()">
<option value="" selected>Select event</option>
<?php foreach ($patterns as $event) : ?>
<option value="<?php echo $event; ?>"><?php echo $event; ?></option>
<?php endforeach; ?>
</select>
<div x-show="hasResource">
<label x-text="resourceName + ' (optional)'" for="resource"></label>
<input id="resource" type="text" :placeholder="resourceName" x-model="resource" maxlength="36" pattern="^[a-zA-Z0-9][a-zA-Z0-9_-]{0,35}$">
<div class="text-fade text-size-xs margin-top-negative-small margin-bottom">Leave empty for wildcard</div>
</div>
<div x-show="hasSubResource">
<label x-text="subResourceName + ' (optional)'" for="subResource"></label>
<input id="subResource" type="text" :placeholder="subResourceName" x-model="subResource" maxlength="36" pattern="^[a-zA-Z0-9][a-zA-Z0-9_-]{0,35}$">
<div class="text-fade text-size-xs margin-top-negative-small margin-bottom">Leave empty for wildcard</div>
</div>
<div x-show="hasSubSubResource">
<label x-text="subSubResourceName + ' (optional)'" for="subSubResource"></label>
<input id="subSubResource" type="text" :placeholder="subSubResourceName" x-model="subSubResource" maxlength="36" pattern="^[a-zA-Z0-9][a-zA-Z0-9_-]{0,35}$">
<div class="text-fade text-size-xs margin-top-negative-small margin-bottom">Leave empty for wildcard</div>
</div>
<div x-show="hasAttribute">
<label for="attribute">Add Attribute (optional)</label>
<select id="attribute" x-model="attribute">
<option value="*">Select attribute</option>
<template x-for="attr in attributes">
<option :value="attr" x-text="attr"></option>
</template>
</select>
</div>
<button x-show="selected" type="submit">Add Event</button> &nbsp; <button data-ui-modal-close="" type="button" class="reverse">Cancel</button>
</form>
</div>
</div>
</li>
</ul>
</div>
</div>
<div data-ui-modal class="modal close box sticky-footer" data-button-hide="on" data-open-event="execute-now">
<button type="button" class="close pull-end" data-ui-modal-close=""><i class="icon-cancel"></i></button>
<h1 class="margin-bottom">Execute Function</h1>
<form data-ls-if="{{project-function.deployment}} !== ''" name="functions.createExecution" class="margin-top"
data-analytics
data-analytics-activity
data-analytics-event="submit"
data-analytics-category="console"
data-analytics-label="Create Function Execution"
data-service="functions.createExecution"
data-event="submit"
data-param-function-id="{{router.params.id}}"
data-success="alert,trigger"
data-success-param-alert-text="Function executed successfully"
data-success-param-trigger-events="functions.createExecution"
data-failure="alert"
data-failure-param-alert-text="Failed to execute function"
data-failure-param-alert-classname="error">
<label for="execution-data">Custom Data</label>
<textarea id="execution-data" name="data" autocomplete="off" class="margin-bottom" placeholder="Data string (optional)"></textarea>
<button type="submit" style="vertical-align: top;">Execute Now</button>
</form>
</div>
<div data-ui-modal class="modal close box sticky-footer" data-button-hide="on" data-open-event="create-deployment">
<button type="button" class="close pull-end" data-ui-modal-close=""><i class="icon-cancel"></i></button>
<h1 class="margin-bottom-xl">Create a New Deployment</h1>
<ul class="phases padding margin-top-negative-small" data-ui-phases>
<li>
<h2 style="display: none">CLI</h2>
<p><b>Unix</b></p>
<div class="margin-bottom">
<textarea type="hidden" data-ls-bind="appwrite functions createDeployment \
--functionId={{project-function.$id}} \
--activate=true \
--entrypoint='scriptFile' \
--code='.'" data-forms-code="bash" data-lang="bash" data-lang-label="Bash"></textarea>
</div>
<p><b>PowerShell</b></p>
<div class="margin-bottom">
<textarea type="hidden" data-ls-bind="appwrite functions createDeployment `
--functionId={{project-function.$id}} `
--activate=true `
--entrypoint='scriptFile' `
--code='.'" data-forms-code="powershell" data-lang="powershell" data-lang-label="PowerShell"></textarea>
</div>
<p>Learn more about <a href="https://appwrite.io/docs/server/functions#functionsCreateDeployment" target="_blank">creating deployments</a>, installing and using the <a href="https://appwrite.io/docs/command-line" target="_blank">Appwrite CLI</a>.</p>
</li>
<li>
<h2 style="display: none">Manual</h2>
<form class="margin-top-negative"
data-analytics
data-analytics-activity
data-analytics-event="submit"
data-analytics-category="console"
data-analytics-label="Create Function Deployment"
data-service="functions.createDeployment"
data-scope="sdk"
data-event="submit"
data-success="alert,trigger,reset"
data-success-param-alert-text="Created function deployment successfully"
data-success-param-trigger-events="functions.createDeployment"
data-failure="alert"
data-failure-param-alert-text="Failed to create function deployment"
data-failure-param-alert-classname="error">
<input type="hidden" name="functionId" data-ls-bind="{{router.params.id}}" />
<label for="deployment-entrypoint">Entrypoint</label>
<input type="text" id="deployment-entrypoint" name="entrypoint" required autocomplete="off" class="margin-bottom" placeholder="main.js" />
<label for="deployment-code">Gzipped Code (tar.gz file)</label>
<input type="file" name="code" id="deployment-code" size="1" required accept="application/x-gzip,.gz">
<div class="text-fade text-size-xs margin-top-negative-small margin-bottom">(Max file size allowed: <?php echo $fileLimitHuman; ?>)</div>
<label for="deployment-activate" class="margin-bottom-large"><input type="checkbox" class="margin-start-small" id="deployment-activate" name="activate" /> Activate Deployment after build</label>
<footer>
<button type="submit">Create</button> &nbsp; <button data-ui-modal-close="" type="button" class="reverse">Cancel</button>
</footer>
</form>
</li>
</ul>
</div>