UNPKG

@grafana/alerting

Version:

Grafana Alerting Library – Build vertical integrations on top of the industry-leading alerting solution

github.com/grafana/grafana

grafana/grafana

1 lines • 3.69 kB
1
{"version":3,"file":"ContactPointSelector.mjs","sources":["../../../../../../src/grafana/contactPoints/components/ContactPointSelector/ContactPointSelector.tsx"],"sourcesContent":["import { chain } from 'lodash';\n\nimport { Combobox, ComboboxOption } from '@grafana/ui';\n\nimport type { ContactPoint } from '../../../api/notifications/v0alpha1/types';\nimport { useListContactPoints } from '../../hooks/v0alpha1/useContactPoints';\nimport { getContactPointDescription } from '../../utils';\n\nimport { CustomComboBoxProps } from './ComboBox.types';\n\nconst collator = new Intl.Collator('en', { sensitivity: 'accent' });\n\nexport type ContactPointSelectorProps = CustomComboBoxProps<ContactPoint>;\n\n/**\n * Contact Point Combobox which lists all available contact points\n * @TODO make ComboBox accept a ReactNode so we can use icons and such\n */\nfunction ContactPointSelector(props: ContactPointSelectorProps) {\n const { currentData: contactPoints, isLoading } = useListContactPoints(\n {},\n { refetchOnFocus: true, refetchOnMountOrArgChange: true }\n );\n\n // Create a mapping of options with their corresponding contact points\n const contactPointOptions = chain(contactPoints?.items)\n .toArray()\n .map((contactPoint) => ({\n option: {\n label: contactPoint.spec.title,\n value: contactPoint.metadata.uid ?? contactPoint.spec.title,\n description: getContactPointDescription(contactPoint),\n } satisfies ComboboxOption<string>,\n contactPoint,\n }))\n .value()\n .sort((a, b) => collator.compare(a.option.label, b.option.label));\n\n const options = contactPointOptions.map<ComboboxOption>((item) => item.option);\n\n const handleChange = (selectedOption: ComboboxOption<string> | null) => {\n if (selectedOption == null && props.isClearable) {\n props.onChange(null);\n return;\n }\n\n if (selectedOption) {\n const matchedOption = contactPointOptions.find(({ option }) => option.value === selectedOption.value);\n if (!matchedOption) {\n return;\n }\n\n props.onChange(matchedOption.contactPoint);\n }\n };\n\n return <Combobox {...props} loading={isLoading} options={options} onChange={handleChange} />;\n}\n\nexport { ContactPointSelector };\n"],"names":[],"mappings":";;;;;;;AAUA,MAAM,QAAA,GAAW,IAAI,IAAA,CAAK,QAAA,CAAS,MAAM,EAAE,WAAA,EAAa,UAAU,CAAA;AAQlE,SAAS,qBAAqB,KAAA,EAAkC;AAC9D,EAAA,MAAM,EAAE,WAAA,EAAa,aAAA,EAAe,SAAA,EAAU,GAAI,oBAAA;AAAA,IAChD,EAAC;AAAA,IACD,EAAE,cAAA,EAAgB,IAAA,EAAM,yBAAA,EAA2B,IAAA;AAAK,GAC1D;AAGA,EAAA,MAAM,mBAAA,GAAsB,MAAM,aAAA,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,aAAA,CAAe,KAAK,EACnD,OAAA,EAAQ,CACR,GAAA,CAAI,CAAC,YAAA,KAAc;AA3BxB,IAAA,IAAA,EAAA;AA2B4B,IAAA,OAAA;AAAA,MACtB,MAAA,EAAQ;AAAA,QACN,KAAA,EAAO,aAAa,IAAA,CAAK,KAAA;AAAA,QACzB,QAAO,EAAA,GAAA,YAAA,CAAa,QAAA,CAAS,GAAA,KAAtB,IAAA,GAAA,EAAA,GAA6B,aAAa,IAAA,CAAK,KAAA;AAAA,QACtD,WAAA,EAAa,2BAA2B,YAAY;AAAA,OACtD;AAAA,MACA;AAAA,KACF;AAAA,EAAA,CAAE,CAAA,CACD,KAAA,EAAM,CACN,IAAA,CAAK,CAAC,CAAA,EAAG,CAAA,KAAM,QAAA,CAAS,OAAA,CAAQ,EAAE,MAAA,CAAO,KAAA,EAAO,CAAA,CAAE,MAAA,CAAO,KAAK,CAAC,CAAA;AAElE,EAAA,MAAM,UAAU,mBAAA,CAAoB,GAAA,CAAoB,CAAC,IAAA,KAAS,KAAK,MAAM,CAAA;AAE7E,EAAA,MAAM,YAAA,GAAe,CAAC,cAAA,KAAkD;AACtE,IAAA,IAAI,cAAA,IAAkB,IAAA,IAAQ,KAAA,CAAM,WAAA,EAAa;AAC/C,MAAA,KAAA,CAAM,SAAS,IAAI,CAAA;AACnB,MAAA;AAAA,IACF;AAEA,IAAA,IAAI,cAAA,EAAgB;AAClB,MAAA,MAAM,aAAA,GAAgB,mBAAA,CAAoB,IAAA,CAAK,CAAC,EAAE,QAAO,KAAM,MAAA,CAAO,KAAA,KAAU,cAAA,CAAe,KAAK,CAAA;AACpG,MAAA,IAAI,CAAC,aAAA,EAAe;AAClB,QAAA;AAAA,MACF;AAEA,MAAA,KAAA,CAAM,QAAA,CAAS,cAAc,YAAY,CAAA;AAAA,IAC3C;AAAA,EACF,CAAA;AAEA,EAAA,uBAAO,GAAA,CAAC,YAAU,GAAG,KAAA,EAAO,SAAS,SAAA,EAAW,OAAA,EAAkB,UAAU,YAAA,EAAc,CAAA;AAC5F;;;;"}