Type ahead search does not work from Task Module - botframework

I need to implement a scenario where type ahead search makes a call to my remote api and fills in the choice list. This works fine the if adaptive card is sent directly in the chat. But this not work inside if the adaptive card is sent in the task module.
Steps
Following is the message which is sent for adaptive card
const card = CardFactory.adaptiveCard({
type: 'AdaptiveCard',
body: [
{
type: 'RichTextBlock',
inlines: [
{
type: 'TextRun',
text: 'Test',
weight: 'bolder',
},
{
type: 'TextRun',
text: 'Test',
}
],
separator: parseInt(index) === 0,
spacing: parseInt(index) === 0 ? 'extraLarge': 'default',
},
{
title: 'Update',
type: 'Action.Submit',
data: {
msteams: {
type: 'task/fetch'
},
id: 'Upate Id',
buttonText: 'Update',
}
}
],
$schema: 'http://adaptivecards.io/schemas/adaptive-card.json',
version: '1.5',
})
Following is card which is sent in task module
const card = CardFactory.adaptiveCard({
$schema: 'http://adaptivecards.io/schemas/adaptive-card.json',
version: '1.5',
type: 'AdaptiveCard',
body: [
{
"columns": [
{
"width": "stretch",
"items": [
{
"choices": [
{
"title": "Static Option 1",
"value": "static_option_1"
},
{
"title": "Static Option 2",
"value": "static_option_2"
},
{
"title": "Static Option 3",
"value": "static_option_3"
}
],
"isMultiSelect": false,
"style": "filtered",
"choices.data": {
"type": "Data.Query",
"dataset": "npmpackages",
"testkey": "harkirat"
},
"id": "choiceselect",
"type": "Input.ChoiceSet"
}
],
"type": "Column"
}
],
"type": "ColumnSet"
}
],
actions: [
{
type: 'Action.Submit',
title: 'Save',
data: {
privateMeta,
replyToId
}
}
]
});
Following is the onActivityInvoke code:-
async onInvokeActivity(context: TurnContext): Promise<InvokeResponse<any>> {
if (context.activity.name === 'task/fetch') {
const result = await this.handleTeamsTaskModuleFetch(context, {
replyToId: context.activity.replyToId,
data: context.activity.value.data
});
return {
status: 200,
body: result
}
}
if (context.activity.name == 'application/search') {
const successResult = {
status: 200,
body: {
"type": "application/vnd.microsoft.search.searchResponse",
"value": {
"results": [
{
"value": "FluentAssertions",
"title": "A very extensive set of extension methods"
},
{
"value": "FluentUI",
"title": "Fluent UI Library"
}
]
}
}
}
return successResult;
}
}
Note that the activityInvoke function is not called when I enter the search text in my input box. However, if I send this card directly i.e without task module and directly in chat it works just fine.
Can someone please help me understand if I am missing something, is this a bug or the feature itself is not supported?

Related

qrcode-vue3 CORS issue intermittently

I am using this package - qrcode-vue3 in my Laravel Vue project.
I am creating a QR code in various places of the app, each of which contains an logo image supplied via the component options:
<template>
<QRCodeVue3
v-bind="qrOptions"
/>
</template>
<script>
import QRCodeVue3 from "qrcode-vue3";
import {computed} from "vue";
import {useStore} from "vuex";
export default {
name: "QrGenerator",
components: {
QRCodeVue3,
},
props: {
qrData: {
type: String,
default: undefined,
},
withSquareLogo: {
type: Boolean,
default: true,
},
width: {
type: Number,
default: 300,
},
height: {
type: Number,
default: 300,
},
download: {
type: Boolean,
default: true,
},
downloadFileName: {
type: String,
default: undefined,
},
},
setup(props) {
const store = useStore();
const colors = computed(() => store.getters['whiteLabel/colors']);
const logos = computed(() => store.getters['whiteLabel/logos']);
const qrOptions = computed( () => ({
"backgroundOptions": {
"color": "#ffffff"
},
"backgroundOptionsHelper": {
"colorType": {
"gradient": false,
"single": true
},
"gradient": {
"color1": "#ffffff",
"color2": "#ffffff",
"linear": true,
"radial": false,
"rotation": "0"
}
},
"cornersDotOptions": {
"color": "#000000",
"type": ""
},
"cornersDotOptionsHelper": {
"colorType": {
"gradient": false,
"single": true
},
"gradient": {
"color1": "#000000",
"color2": "#000000",
"linear": true,
"radial": false,
"rotation": "0"
}
},
"cornersSquareOptions": {
"color": "#000000",
"type": "extra-rounded"
},
"cornersSquareOptionsHelper": {
"colorType": {
"gradient": false,
"single": true
},
"gradient": {
"color1": "#000000",
"color2": "#000000",
"linear": true,
"radial": false,
"rotation": "0"
}
},
"value": props.qrData,
"dotsOptions": {
"color": colors.value.primary_color,
"type": "extra-rounded"
},
"dotsOptionsHelper": {
"colorType": {
"gradient": false,
"single": true
},
"gradient": {
"color1": colors.value.primary_color,
"color2": colors.value.primary_color,
"linear": true,
"radial": false,
"rotation": "0"
}
},
"image": logos.value.square,
"imageOptions": {
"hideBackgroundDots": true,
"imageSize": 0.4,
"margin": 0,
"crossOrigin": "Anonymous"
},
"margin": 0,
"qrOptions": {
"errorCorrectionLevel": "Q",
"mode": "Byte",
"typeNumber": "0"
},
"download": false,
"height": props.height,
"width": props.width
}));
return {
logos,
colors,
qrOptions,
}
}
};
This works OK for some of the time, with logo loading into the QR code. The logo is in a static assets S3 bucket, that is public access and allow-origins of "*". The domain to the static assets bucket (https://static.myapp.com.au) is being proxied via CloudFlare.
But for some of the time I get a CORS error as the component is mounting and generating the QR:
Access to image at 'https://static.myapp.com.au/logo_square.png' from origin 'https://lins.myapp.com.au' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. index.js?f95a:1
GET https://static.myapp.com.au/logo_square.png net::ERR_FAILED 200
It has wasted a bunch of time now but without luck in finding the solution. It will work consecutively for a number of tries (say 20 times), then try again some minutes later and Bang! CORS error.
Thanks

How to create custom resolvers for Gatsby page queries?

I have a Gatsby application pulling data from Sanity.
This is Sanity's schema for the course.js:
import video from './video'
export default {
// Computer name
name: `courses`,
// Visible title
title: `Courses`,
type: `document`,
fields: [
{
name: `title`,
title: `Course title`,
type: `string`,
description: `Name of the course`
},
{
name: `slug`,
title: `slug`,
type: `slug`,
options: {
source: `title`,
maxLength: 100,
}
},
{
name: `price`,
title: `Price`,
type: `number`
},
{
name: `thumbnail`,
title: `Thumbnail`,
type: `image`,
options: {
hotspot: true,
}
},
{
name: `playlist`,
title: `Playlist`,
type: `array`,
of: [
{
title: `Video`,
name: `video`,
type: `video`,
}
]
},
]
}
And this is Sanity's schema for video.js:
export default {
// Computer name
name: `video`,
// Visible title
title: `Video`,
type: `object`,
fields: [
{ name: `title`, type: `string`, title: `Video title` },
{ name: `url`, type: `url`, title: `URL` },
{ name: `public`, title: `public`, type: `boolean`, initialValue: false }
]
}
This Gatsby page query:
{
allSanityCourses {
nodes {
title
price
playlist {
url
title
public
}
}
}
}
Results in:
{
"data": {
"allSanityCourses": {
"nodes": [
{
"title": "Master VS Code",
"price": 149,
"playlist": [
{
"url": "https://www.youtube.com/watch?v=PRz1Nv9GUzs",
"title": "Introduction",
"public": true
},
{
"url": "https://www.youtube.com/watch?v=PRz1Nv9GUzs",
"title": "Philosophy",
"public": false
},
{
"url": "https://www.youtube.com/watch?v=PRz1Nv9GUzs",
"title": "Tech and Tools",
"public": false
},
{
"url": "https://www.youtube.com/watch?v=PRz1Nv9GUzs",
"title": "Integration",
"public": true
},
{
"url": "https://www.youtube.com/watch?v=PRz1Nv9GUzs",
"title": "Extensions",
"public": false
}
]
}
]
}
},
"extensions": {}
}
To prevent the url field from being injected into the React component this Gatsby page query runs on (because these urls are paid for), I need to remove it, if the public field is set to false.
I've tried inserting this into gastby-node.js:
exports.createSchemaCustomization = ({ actions, schema }) => {
const { createTypes } = actions
const typeDefs = [
schema.buildObjectType({
name: "SanityCourses",
fields: {
playlist: {
type: "[SanityVideo]",
url: {
type: "String",
resolve: (source) => "nope"
},
},
},
interfaces: ["Node"],
}),
]
createTypes(typeDefs)
}
And:
exports.createResolvers = ({ createResolvers }) => {
const resolvers = {
SanityCourses: {
playlist: {
type: "[SanityVideo]",
url: {
type: "String",
resolve(source, args, context, info) {
return "nope"
},
}
},
},
}
createResolvers(resolvers)
}
But neither seems to work. The url field returns the url as always. The resolvers don't even seem to fire (I've tried putting console.log()'s in them).
Any help on how to remove the url field if the public field is set to false, or general direction to go in would be very appreciated.
Ditch the attempt in createSchemaCustomization since you don't need to customize the schema here (though I believe there is a way to achieve what you want using it, it is not expected that the data in it is sourced from existing nodes, and this undeclared dependency can create caching issues).
Then update your createResolvers function to something like this:
exports.createResolvers = ({ createResolvers }) => {
createResolvers({
SanityVideo: {
safeUrl: {
type: "String",
resolve: (source, args, context, info) => source.public ? source.url : null
},
},
})
}
I don't believe resolvers can replace schema-originated nodes (fields), hence using safeUrl instead of url
The type you are adding a field to is SanityVideo, and it doesn't matter what the parent node is—this will apply to all instances of SanityVideo in your data

Kendo Grid Server side filtering with a array type column

I have this kendo grid blinded to my web service. One of the columns has a custom filter with a kendo multiselector array so the client can choose multiple ItemTypes. The grid is displaying data correctly but my costume filters are not working for this particular column. I got this error from the service: "A binary operator with incompatible types was detected. Found operand types 'Telerik.Sitefinity.DynamicTypes.Model.ClinicFinder.Clinic.ItemType.ItemType' and 'Edm.Int32' for operator kind 'Equal'."
My grid definition
$("#grid").kendoGrid({
dataSource: {
type: "odata-v4",
transport: {
read: {
url: function () {
return "//myservice/api/clinics?$select=Id,Title,Address,ItemType,productsystems&top=20";
}
}
},
schema: {
model: {
fields: {
Title: { type: "string" },
CountryCode: { type: "string" },
Street: { type: "string" },
City: { type: "string" },
Zip: { type: "string" },
ItemType: { type: "" }
}
}
},
serverPaging: true,
serverFiltering: true,
serverSorting: false,
pageSize: 20
},
pageable: true,
filterable: {
mode: "row",
extra: false,
showOperators: false,
operators: {
string: {
contains: "contains"
}
}
},
sortable: false,
columns: [
{ field: "Title", title: "Clinic" },
{ field: "CountryCode", title: "Country" },
{ field: "Street", title: "Address" },
{ field: "City", title: "City" },
{ field: "Zip", title: "Zip", filterable: false },
{ field: "ItemType", title: "Clinic Type", filterable: { multi: true } }
],
rowTemplate: kendo.template($("#template").html())
});
My Filter function
function filterByclinicCategory() {
var filter = { logic: "or", filters: [] };
var grid = $('#grid').data('kendoGrid');
var filterValue = $("#clinicTypeFilter").data("kendoMultiSelect").value();
var clinicCode = [];
if (filterValue.length > 0) {
$.each(filterValue, function (i, v) {
clinicCode.push(convertClinicTypesInCodes(v));
filter.filters.push({
field: "ItemType", operator: "eq", value: clinicCode, logic: "or"
});
grid.dataSource.filter(filter);
});
} else {
$("#grid").data("kendoGrid").dataSource.filter({});
}
}
ItemType is the column I can´t filter.
My webservice data
{
"#odata.context": "https://sf-admin-local.medel.com/api/wstest/$metadata#clinics(*)",
"value": [
{
"Id": "896aa08b-2f17-64e6-80bd-ff09000c6e28",
"LastModified": "2019-05-13T09:28:04Z",
"PublicationDate": "2018-06-19T14:19:13Z",
"DateCreated": "2018-06-19T14:19:13Z",
"UrlName": "??",
"Email": "",
"URL": "",
"Telephone": "",
"Title": "????????",
"officeregions": [],
"salespartnerregions": [],
"productsystems": [
"b8ec2a8b-2f17-64e6-80bd-ff09000c6e28",
"1878cb61-ac79-69d9-867b-ff01007297b6",
"1b78cb61-ac79-69d9-867b-ff01007297b6",
"36d8938b-2f17-64e6-80bd-ff09000c6e28"
],
"Area": "",
"Order": 0,
"Tags": [],
"AdditionalInformation": "",
"ImportID": 1,
"Featured": false,
"ItemType": "2",
"Address": {
"Id": "d76aa08b-2f17-64e6-80bd-ff09000c6e28",
"CountryCode": "AT",
"StateCode": "",
"City": "????",
"Zip": "6800",
"Street": "Carinagasse ?????",
"Latitude": 47.2311043,
"Longitude": 9.580079999999953,
"MapZoomLevel": 8
}
}
]
}
I manage to fix it using parameterMap https://docs.telerik.com/kendo-ui/api/javascript/data/datasource/configuration/transport.parametermap.
I add a parameterMap: functiondata, type) function, with that I was able to intercept and change the call made by the filters.
parameterMap: function (data, type) {
var c = kendo.data.transports["odata-v4"].parameterMap(data, type);
if (c.$filter) {
//my transformation
c = myTransformation;
return c;
} else{
return c; //not apply transformation loading the data
}
}

ExtJS: How to hide specific data on store with filtering?

I want to hide a record on Grid that returns from server.
I've setted a filter on store and can reach that specific data but how I'll handle to hide/ignore this record?
fooStore: {
....
filters: [
function(item) {
let me = this;
let theRecord = item.data.status === MyApp.STATUS; //true
if (theRecord) {
console.log(theRecord); //True
console.log("So filter is here!!")
//How to hide/ignore/avoid to load this specific data record to load Grid??
}
}
]
},
Returned JSON;
{
"success": true,
"msg": "OK",
"count": 3,
"data": [
{
//Filter achives to this record and aim to hide this one; avoid to load this record.
"id": 102913410,
"status": "P"
},
{
"id": 98713410,
"status": "I"
},
{
"id": 563423410,
"status": "A"
}
]
}
I can't save my fiddle cause i don't have sencha forum's account so i give you my code :
Ext.application({
name : 'Fiddle',
launch : function() {
var model = Ext.create('Ext.data.Model', {
extend: 'Ext.data.Model',
fields: [
{name: 'id', type: 'int'},
{name: 'status', type: 'string'},
]
});
var store = Ext.create('Ext.data.Store', {
autoLoad: true,
model: model,
proxy: {
type: 'ajax',
url: 'data.json',
reader: {
type: 'json',
rootProperty: 'data'
}
},
filters: [function(item) {
if (item.data.status === "P") {
return true;
}
else {
return false;
}
}],
listeners: {
load: {
fn: function() {
console.log(this.getRange());
}
}
}
});
}
});
Also i create data.json like this :
{
"success": true,
"msg": "OK",
"count": 3,
"data": [{
"id": 102913410,
"status": "P"
}, {
"id": 98713410,
"status": "I"
}, {
"id": 563423410,
"status": "A"
}]
}
I thinks it's near to you'r code and after the loading of the store the filter work as you can this :
Here is sencha fiddle link : https://fiddle.sencha.com/#view/editor
If this can't work, i don't understand what the fuck doing...

KendoUI scheduler doesn't display data

I'm having a bit of difficulty with KendoUI Scheduler data(scheduler events or whatever you want to call them) display. The call is made amd the data comes in but it doesn't display it, nor does it cause any errors. I've pasted the code and responce, hoping that someone knows what I'm doing wrong.
And yes I've been switching between json/jsonp as the datatype and batch set to true and false in all possible combinations.
The Code:
var my_dataSource;
$("#calendar").kendoScheduler({
height: "650px",
timezone: "Etc/UTC",
views: [
"day",
"week",
{ type: "month", selected: true },
"agenda"
]
});
my_dataSource = new kendo.data.SchedulerDataSource({
transport: {
read: {
url: "ashx/Calendar/GetCalendarData.ashx",
cache: false,
data: {
dtFrom: convertDate($("#calendar").data("kendoScheduler").view().startDate()),
dtUntil: convertDate($("#calendar").data("kendoScheduler").view().endDate()),
DateInterval: "month",
dateIntervalSteps: "1",
Categories: ""
},
dataType: "jsonp"
},
batch: true,
parameterMap: function (options, operation) {
//console.log(JSON.stringify(options));
return options;
}
},
schema: {
data: "Data",
model: {
id: "taskID",
fields: {
taskID: { from: "id", type: "number" },
title: { from: "summary", defaultValue: "No title", validation: { required: false } },
start: { type: "date", from: "startTime" },
end: { type: "date", from: "endTime" },
//startTimezone: { from: "StartTimezone" },
//endTimezone: { from: "EndTimezone" },
//description: { from: "Description" },
//recurrenceId: { from: "RecurrenceID" },
//recurrenceRule: { from: "RecurrenceRule" },
//recurrenceException: { from: "RecurrenceException" },
ownerId: { from: "eOwnerId", defaultValue: 1 },
isAllDay: { type: "boolean", from: "allDay" }
}
}
}
});
var cal = $("#calendar").data("kendoScheduler");
cal.dataSource = my_dataSource;
The Response:
[
{
"id": 329837,
"summary": "Lorem Ipsum",
"startTime": "Date(1375862400)",
"endTime": "Date(1377273600)",
"allDay": true,
"calendar": "cat10001",
"eOwnerId": 1569,
"Title": "Project Meeting"
},
{
"id": 334664,
"summary": "Lorem Ipsum",
"startTime": "Date(1376985600)",
"endTime": "Date(1376989200)",
"allDay": false,
"calendar": "cat10002",
"eOwnerId": 130,
"Title": "Meeting"
},
{
"id": 334659,
"summary": "Lorem Ipsum",
"startTime": "Date(1377007200)",
"endTime": "Date(1377010800)",
"allDay": false,
"calendar": "cat10003",
"eOwnerId": 1810,
"Title": "Task"
}
]
I had a the same problem while getting no errors. What fixed it was (silly but) i was setting the start and end timezones ie. task.setEndTimezone(TimeZone.getTimeZone("UTC"));, just set them to null while timezone is still set in the returned start and end datetime of the task. Hope this helps.
I see "ReferenceError: convertDate is not defined" when using Firefox debugging...
dtFrom: convertDate($("#calendar").data("kendoScheduler").view().startDate()),
dtUntil: convertDate($("#calendar").data("kendoScheduler").view().endDate()),
You may want to make sure you are including all of the appropriate .js files

Resources