Why does the instance still use the default props even after setting different prop values when deploying a source file?

This topic was automatically generated from Slack. You can find the original thread here.

from cli if i push a source (mjs) file with some props, if i do pd dev, it is asking em to give some default prop values,

then when i deploy it as a source, and use it to instantiateviaApi , and instantiate by setting these props with different prop values, but the instance created is still using the default props i first provided

It sounds like you’re encountering an issue where the default prop values provided during the pd dev session are being used instead of the values you set when instantiating the source via the API. Let’s break down the steps and see if we can identify the issue. ### Steps to Deploy and Instantiate a Source with Custom Props 1. Develop the Source Locally: When you run pd dev <filename>, you are asked to provide default values for the props. This is necessary for the local development environment to function correctly. 2. Deploy the Source: Once you’re satisfied with your source, you deploy it using: bash pd deploy <filename> 3. Instantiate the Source via API: When you instantiate the source via the API, you should be able to set custom values for the props. Ensure you’re passing the correct prop values in your API request. ### Possible Issues and Solutions 1. Check API Request: Ensure that your API request to instantiate the source is correctly formatted and includes the custom prop values. Here’s an example of how you might instantiate a source via the API: bash curl -X POST https://api.pipedream.com/v1/sources \ -H "Authorization: Bearer <YOUR_API_KEY>" \ -H "Content-Type: application/json" \ -d '{ "component_id": "<YOUR_COMPONENT_ID>", "props": { "prop1": "custom_value1", "prop2": "custom_value2" } }' 2. Verify Prop Values in the Source Code: Ensure that the source code correctly references the props. For example: ```
export default defineComponent({ props: { prop1: { type: “string”, label: “Prop 1”, default: “default_value1”, }, prop2: { type: “string”, label: “Prop 2”, default: “default_value2”, }, }, async run({ steps, $ }) { const prop1 = this.prop1; const prop2 = this.prop2; console.log(Prop 1: ${prop1}, Prop 2: ${prop2}); }, });

the following code :

import { axios } from “@pipedream/platform”;

export default defineComponent({
name: “velora-github-issues-source-GET”,
description:
“This is a custom source for Velora AI, which fetches user credentials from an external source, and then uses the GET API to fetch GitHub issues for a user repo, with 15-minute timer intervals.”,
props: {
github: {
type: “app”,
app: “github”,
},
timer: {
type: “$.interface.timer”,
default: {
intervalSeconds: 15 * 60,
},
},
repo_full_name: {
type: “string”,
label: “Repository Full Name”,
description:
“Enter the name of the GitHub repository in the format ‘owner/repo’”,
},
nango_connection_id: {
type: “string”,
label: “Nango Connection ID”,
description: “Enter the Nango Connection ID”,
},
nango_integration_id: {
type: “string”,
label: “Nango Integration ID”,
description: “Enter the Nango Integration ID”,
},
velora_workflow_id: {
type: “string”,
label: “Velora Workflow ID”,
description: “Enter the Workflow ID”,
},
velora_workspace_id: {
type: “string”,
label: “Velora Workspace ID”,
description: “Enter the Workspace ID”,
},
},
dedupe: “greatest”,
async run({ steps, $ }) {
try {
// Step 1: Retrieve the GitHub token from Nango
const nangoResponse = await axios($, {
method: “GET”,
headers: {
Authorization: Bearer ${process.env.VELORA_NANGO_SECRET_KEY},
},
url: https://api.nango.dev/connection/${this.nango_connection_id}?provider_config_key=${this.nango_integration_id},
});

  // Extract the GitHub access token from the response
  const github_token = nangoResponse.credentials.access_token;

  // Step 2: Use the GitHub token to make a request to the GitHub API
  const data = await axios($, {
    method: "get",
    headers: {
      Authorization: `Bearer ${github_token}`,
    },
    url: `https://api.github.com/repos/${this.repo_full_name}/issues`,
  });

  // Step 3: Emit each issue as an event
  data.forEach((issue) => {
    this.$emit(issue, {
      id: issue.id,
      summary: `ISSUE ${issue.number}: ${issue.title}`,
      body: issue.body,
      ts: issue.created_at && +new Date(issue.created_at),
      velora_workflow_id: this.velora_workflow_id,
      velora_workspace_id: this.velora_workspace_id,
    });
  });
} catch (error) {
  // Handle errors gracefully
  $.error(`Failed to fetch issues: ${error.message}`);
}

},
});

if i do pd dev , to deploy this, it asks me prop values, then when i do instantiateviaApi, and change the prop values through there, it still uses the default values

It seems like you’re encountering an issue where the default prop values are being used even after you change them via the API. This could be due to the way the component is being instantiated or how the props are being passed. Let’s ensure that the props are correctly set and used. Here’s a revised version of your component code with some adjustments to ensure the props are correctly utilized: ``` import { axios } from “@pipedream/platform”; export default defineComponent({ name: “velora-github-issues-source-GET”, description: “This is a custom source for Velora AI, which fetches user credentials from an external source, and then uses the GET API to fetch GitHub issues for a user repo, with 15-minute timer intervals.”, props: { github: { type: “app”, app: “github”, }, timer: { type: “$.interface.timer”, default: { intervalSeconds: 15 * 60, }, }, repo_full_name: { type: “string”, label: “Repository Full Name”, description: “Enter the name of the GitHub repository in the format ‘owner/repo’”, }, nango_connection_id: { type: “string”, label: “Nango Connection ID”, description: “Enter the Nango Connection ID”, }, nango_integration_id: { type: “string”, label: “Nango Integration ID”, description: “Enter the Nango Integration ID”, }, velora_workflow_id: { type: “string”, label: “Velora Workflow ID”, description: “Enter the Workflow ID”, }, velora_workspace_id: { type: “string”, label: “Velora Workspace ID”, description: “Enter the Workspace ID”, }, }, dedupe: “greatest”, async run({ steps, $ }) { try { // Step 1: Retrieve the GitHub token from Nango const nangoResponse = await axios($, { method: “GET”, headers: { Authorization: Bearer ${process.env.VELORA_NANGO_SECRET_KEY}, }, url: https://api.nango.dev/connection/${this.nango_connection_id}?provider_config_key=${this.nango_integration_id}, }); // Extract the

in the following code :

import { axios } from “@pipedream/platform”;

export default {
name: “Source Demo”,
description: “This is a demo source”,
props: {
github: {
type: “app”,
app: “github”,
},
timer: {
type: “$.interface.timer”,
default: {
intervalSeconds: 15 * 60,
},
},
repo_full_name: {
type: “string”,
label: “Repository Full Name”,
description:
“Enter the name of the GitHub repository in the format ‘owner/repo’”,
},
},
dedupe: “greatest”,
async run() {
const data = await axios(this, {
method: “get”,
headers: {
Authorization: Bearer ${this.github.$auth.oauth_access_token},
},
url: https://api.github.com/repos/${this.repo_full_name}/issues,
});
data.forEach((issue) => {
this.$emit(issue, {
id: issue.id,
summary: ISSUE ${issue.number}: ${issue.title},
ts: issue.created_at && +new Date(issue.created_at),
});
});
},
};
if i do pd dev , to deploy this, it asks me prop values, then when i do instantiateviaApi, and change the prop values through there, it still uses the default values

You should visit Pricing - Pipedream for the latest pricing, but I’ll do my best to answer. It looks like you’re trying to deploy a Pipedream component and then instantiate it via the API, but you’re encountering an issue where the prop values are not updating as expected. Let’s walk through the steps to ensure that the prop values are correctly updated when you instantiate the component via the API. ### Steps to Deploy and Update Prop Values 1. Deploy the Component: When you run pd dev, you will be prompted to select values for the props. This is necessary for the initial deployment. 2. Instantiate via API: After deploying the component, you can instantiate it via the API. Make sure you are correctly passing the updated prop values in your API request. ### Example API Request to Instantiate the Component with Updated Prop Values Here is an example of how you can instantiate the component with updated prop values using the Pipedream API: bash curl -X POST \ 'https://api.pipedream.com/v1/components/your-component-id/instances' \ -H 'Authorization: Bearer YOUR_API_KEY' \ -H 'Content-Type: application/json' \ -d '{ "props": { "repo_full_name": "new-owner/new-repo", "timer": { "intervalSeconds": 10 ** 60 } } }' ### Component Code Here is the updated component code for reference: ``` import { axios } from “@pipedream/platform”; export default { name: “Source Demo”, description: “This is a demo source”, props: { github: { type: “app”, app: “github”, }, timer: { type: “$.interface.timer”, default: { intervalSeconds: 15 ** 60, }, }, repo_full_name: { type: “string”, label: “Repository Full Name”, description: “Enter the name of the GitHub repository in the format ‘owner/repo’”, }, }, dedupe: “greatest”, async run() { const data = await axios(this, { method: “get”, headers: { Authorization: Bearer ${this.github.$auth.oauth_access_token}, },

i created a custom source :
import { axios } from “@pipedream/platform”;

export default {
name: “Source Demo”,
description: “This is a demo source”,
props: {
github: {
type: “app”,
app: “github”,
},
timer: {
type: “$.interface.timer”,
default: {
intervalSeconds: 15 * 60,
},
},
repo_full_name: {
type: “string”,
label: “Repository Full Name”,
description:
“Enter the name of the GitHub repository in the format ‘owner/repo’”,
},
},
dedupe: “greatest”,
async run() {
const repo_full_name = this.repo_full_name;
const data = await axios(this, {
method: “get”,
headers: {
Authorization: Bearer ${this.github.$auth.oauth_access_token},
},
url: https://api.github.com/repos/${repo_full_name}/issues,
});
data.forEach((issue) => {
this.$emit(issue, {
id: issue.id,
summary: ISSUE ${issue.number}: ${issue.title},
ts: issue.created_at && +new Date(issue.created_at),
});
});
},
};

i pushed it to custom source useing pd deploy, but when i do instantiate via api for different repo_full_name , it isnt setting new values

It looks like you have created a custom source to fetch issues from a GitHub repository, but you’re encountering issues when trying to instantiate it via the API with different repo_full_name values. Let’s review your code and the process to ensure everything is set up correctly. ### Custom Source Code Your custom source code looks mostly correct, but there are a few things to check: 1. Ensure Proper URL Formatting: The URL in your axios request should be correctly formatted without angle brackets (< and >). 2. Check for Proper Deployment: Ensure that your source is properly deployed and that the repo_full_name prop is being correctly set when you instantiate the source via the API. Here’s a slightly revised version of your code: import { axios } from "@pipedream/platform"; export default { name: "Source Demo", description: "This is a demo source", props: { github: { type: "app", app: "github", }, timer: { type: "$.interface.timer", default: { intervalSeconds: 15 * 60, }, }, repo_full_name: { type: "string", label: "Repository Full Name", description: "Enter the name of the GitHub repository in the format 'owner/repo'", }, }, dedupe: "greatest", async run() { const repo_full_name = this.repo_full_name; const data = await axios(this, { method: "get", headers: { Authorization: `Bearer ${this.github.$auth.oauth_access_token}`, }, url: `https://api.github.com/repos/${repo_full_name}/issues`, }); data.forEach((issue) => { this.$emit(issue, { id: issue.id, summary: `ISSUE ${issue.number}: ${issue.title}`, ts: issue.created_at && +new Date(issue.created_at), }); }); }, }; ### Instantiating via API When you instantiate the source via the API, ensure that you are correctly passing the repo_full_name in the configured_props object. Here’s an example of how to do this: ```bash curl -X POST https://api.pipedream.com/v1/sources \ -H “Authorization: Bearer YOUR_API_KEY” \ -H "Content-Type

whenevr i do instantiateviaApi, its still setting with default props, not witht he ones i passed

To better assist you with your issue, could you please provide more details on the following: 1. The specific code or API call you’re using to instantiate the component. 2. The exact props you’re trying to pass. 3. Any error messages or unexpected behavior you’re encountering. This information will help me understand the context and provide a more accurate solution.

// To use any npm package on Pipedream, just import it
import axios from “axios”

export default defineComponent({
async run({ steps, $ }) {
const { data } = await axios({
method: “POST”,
url: “https://api.pipedream.com/v1/workflows?template_id=tch_4RfVGb”,
headers: {
“Authorization”: Bearer ${process.env.VELORA_PIPEDREAM_API_KEY}
},
data: {
“org_id”: “o_PwIP1O1”,
“project_id”: “proj_GzsL0b2”,
“steps”: [
{
“namespace”: “insert_github_issues_raw”,
“props”: {
“supabase”: {
“subdomain”: “{{process.env.VELORA_SUPABASE_SUBDOMAIN}}”,
“service_key”: “{{process.env.VELORA_SUPABASE_SERVICE_KEY}}”
},
“table”: “github_issues_raw”,
“data”: {
“workspace_id”: “{{steps.trigger.event.velora_workspace_id}}”,
“workflow_id”: “{{steps.trigger.event.velora_workflow_id}}”,
“source_type”: “github_issue”,
“github_repo_full_name”: “{{steps.trigger.event.issue.repo_full_name}}”,
“github_issue_title”: “{{steps.trigger.event.issue.title}}”,
“github_issue_body”: “{{steps.trigger.event.issue.body}}”,
“github_issue_url”: “{{steps.trigger.event.issue.html_url}}”,
“github_comments_url”: “{{steps.trigger.event.issue.comments_url}}”,
“github_issue_logged_by”: “{{steps.trigger.event.issue.user.login}}”,
“github_issue_upvote_count”: “{{steps.trigger.event.issue.reactions[+1]}}”,
“github_issue_downvote_count”: “{{steps.trigger.event.issue.reactions[-1]}}”,
“github_issue_logged_at”: “{{steps.trigger.event.issue.created_at}}”,
“github_issue_word_count”: “{{steps.issue_word_count.$return_value}}”
}
}
}
],
“triggers”: [
{
“props”: {
“github”: {
“authProvisionId”: “apn_kVh9xpK”
},
“timer”: {
“intervalSeconds”: 900,
“timezone”: “UTC”
},
“repo_full_name”: steps.trigger.event.body.repo_full_name,
“nango_connection_id”: steps.trigger.event.body.nango_connection_id,
“nango_integration_id”: steps.trigger.event.body.nango_integration_id,
“velora_workflow_id”: steps.trigger.event.body.velora_workflow_id,
“velora_workspace_id”: steps.trigger.event.body.velora_workspace_id
}
}
],
“settings”: {
“name”: “Github issues to product insights - template”,
“auto_deploy”: true
}
}
});

**return** data;

},
});

here the props, are not being setup right, its using the default

To correctly set up the props for the Pipedream component, you need to define them properly within the defineComponent function. Here’s the corrected version of your code: ``` import { axios } from “@pipedream/platform”; export default defineComponent({ props: { github: { type: “app”, app: “github”, }, supabase: { type: “app”, app: “supabase”, }, veloraApiKey: { type: “string”, label: “Velora API Key”, description: “The API key for Velora”, }, veloraSupabaseSubdomain: { type: “string”, label: “Velora Supabase Subdomain”, description: “The subdomain for Velora Supabase”, }, veloraSupabaseServiceKey: { type: “string”, label: “Velora Supabase Service Key”, description: “The service key for Velora Supabase”, }, }, async run({ steps, $ }) { const { data } = await axios($, { method: “POST”, url: “https://api.pipedream.com/v1/workflows?template_id=tch_4RfVGb”, headers: { Authorization: Bearer ${this.veloraApiKey}, }, data: { org_id: “o_PwIP1O1”, project_id: “proj_GzsL0b2”, steps: [ { namespace: “insert_github_issues_raw”, props: { supabase: { subdomain: this.veloraSupabaseSubdomain, service_key: this.veloraSupabaseServiceKey, }, table: “github_issues_raw”, data: { workspace_id: “{{steps.trigger.event.velora_workspace_id}}”, workflow_id: “{{steps.trigger.event.velora_workflow_id}}”, source_type: “github_issue”, github_repo_full_name: “{{steps.trigger.event.issue.repo_full_name}}”, github_issue_title: “{{steps.trigger.event.issue.title}}”, github_issue_body: “{{steps.trigger.event.issue.body}}”, github_issue_url: “{{steps.trigger.event.issue.html_url}}”, github_comments_url: “{{steps.trigger.event.issue.comments_url}}”, github_issue_logged_by: "{{steps.trigger.event.issue.user.login

in the following code :
import { axios } from “@pipedream/platform”;

export default {
name: “Source Demo”,
description: “This is a demo source”,
props: {
github: {
type: “app”,
app: “github”,
},
timer: {
type: “$.interface.timer”,
default: {
intervalSeconds: 15 * 60,
},
},
repo_full_name: {
type: “string”,
label: “Repository Full Name”,
description:
“Enter the name of the GitHub repository in the format ‘owner/repo’”,
},
},
dedupe: “greatest”,
async run() {
const repo_full_name = this.repo_full_name;
const data = await axios(this, {
method: “get”,
headers: {
Authorization: Bearer ${this.github.$auth.oauth_access_token},
},
url: https://api.github.com/repos/${repo_full_name}/issues,
});
data.forEach((issue) => {
this.$emit(issue, {
id: issue.id,
summary: ISSUE ${issue.number}: ${issue.title},
ts: issue.created_at && +new Date(issue.created_at),
});
});
},
};

the prop repo_full_name, is it conifgurable during instantiateviaapi, because if i try instantiateviaapi, it is still using the default prop values ipassed during pd dev which i dont want

Yes, the repo_full_name prop is configurable during instantiation via the API. When you instantiate a component via the API, you can pass values for any props defined in the component. If the prop values you provide during instantiation are not being used, it might be due to how the API request is being made or how the values are being passed. Here’s an example of how you can instantiate the component via the API with a custom value for repo_full_name: bash curl -X POST https://api.pipedream.com/v1/components \ -H "Authorization: Bearer <YOUR_API_KEY>" \ -H "Content-Type: application/json" \ -d '{ "component": { "name": "Source Demo", "description": "This is a demo source", "props": { "github": { "type": "app", "app": "github" }, "timer": { "type": "$.interface.timer", "default": { "intervalSeconds": 15 * 60 } }, "repo_full_name": { "type": "string", "label": "Repository Full Name", "description": "Enter the name of the GitHub repository in the format 'owner/repo'", "default": "default_owner/default_repo" } }, "dedupe": "greatest", "run": "async function({ steps, $ }) { const repo_full_name = this.repo_full_name; const data = await axios(this, { method: 'get', headers: { Authorization: `Bearer ${this.github.$auth.oauth_access_token}` }, url: `https://api.github.com/repos/${repo_full_name}/issues` }); data.forEach((issue) => { this.$emit(issue, { id: issue.id, summary: `ISSUE ${issue.number}: ${issue.title}`, ts: issue.created_at && +new Date(issue.created_at) }); }); }" }, "props": { "repo_full_name": "custom_owner/custom_repo" } }' In this example, the repo_full_name prop is set to "custom_owner/custom_repo" during instantiation. Ensure that the props object in the API request contains the custom values you want to use. If you continue to face issues, please verify that the API request is correctly