diff --git a/hyperglass/ui/components/looking-glass-form.tsx b/hyperglass/ui/components/looking-glass-form.tsx index 5a095ddd..87693fa9 100644 --- a/hyperglass/ui/components/looking-glass-form.tsx +++ b/hyperglass/ui/components/looking-glass-form.tsx @@ -15,22 +15,11 @@ import { import { useConfig } from '~/context'; import { FormRow } from '~/elements'; import { useStrf, useGreeting, useDevice, useFormState } from '~/hooks'; +import { isFQDN } from '~/util'; import { isString, isQueryField, Directive } from '~/types'; import type { FormData, OnChangeArgs } from '~/types'; -/** - * Don't set the global flag on this. - * @see https://stackoverflow.com/questions/24084926/javascript-regexp-cant-use-twice - * - * TLDR: the test() will pass the first time, but not the second. In React Strict Mode & in a dev - * environment, this will mean isFqdn will be true the first time, then false the second time, - * submitting the FQDN to hyperglass the second time. - */ -const fqdnPattern = new RegExp( - /^(?!:\/\/)([a-zA-Z0-9-]+\.)?[a-zA-Z0-9-][a-zA-Z0-9-]+\.[a-zA-Z-]{2,6}?$/im, -); - export const LookingGlassForm = (): JSX.Element => { const { web, messages } = useConfig(); @@ -84,7 +73,7 @@ export const LookingGlassForm = (): JSX.Element => { // const isFqdnQuery = useIsFqdn(form.queryTarget, form.queryType); const isFqdnQuery = useCallback( (target: string, fieldType: Directive['fieldType'] | null): boolean => - fieldType === 'text' && fqdnPattern.test(target), + fieldType === 'text' && isFQDN(target), [], ); diff --git a/hyperglass/ui/util/common.test.ts b/hyperglass/ui/util/common.test.ts index 55f9f77b..80eef5bc 100644 --- a/hyperglass/ui/util/common.test.ts +++ b/hyperglass/ui/util/common.test.ts @@ -1,4 +1,4 @@ -import { all, chunkArray, entries, dedupObjectArray, andJoin } from './common'; +import { all, chunkArray, entries, dedupObjectArray, andJoin, isFQDN } from './common'; test('all - all items are truthy', () => { expect(all(1 === 1, true, 'one' === 'one')).toBe(true); @@ -74,3 +74,27 @@ describe('andJoin - join array of strings to sentence structure', () => { expect(result).toBe('Tom, Dick & Harry'); }); }); + +describe('isFQDN - determine if a string is an FQDN pattern', () => { + it('is null and should be false', () => { + expect(isFQDN(null)).toBe(false); + }); + it('is undefined and should be false', () => { + expect(isFQDN(undefined)).toBe(false); + }); + it("isn't an FQDN and should be false", () => { + expect(isFQDN('example')).toBe(false); + }); + it('is a domain and should be true', () => { + expect(isFQDN('example.com')).toBe(true); + }); + it('is a simple FQDN and should be true', () => { + expect(isFQDN('www.example.com')).toBe(true); + }); + it('is a long FQDN and should be true', () => { + expect(isFQDN('one.two.example.com')).toBe(true); + }); + it('is a longer FQDN and should be true', () => { + expect(isFQDN('one.two.three.four.five.example.com')).toBe(true); + }); +}); diff --git a/hyperglass/ui/util/common.ts b/hyperglass/ui/util/common.ts index 4650874e..67eedc19 100644 --- a/hyperglass/ui/util/common.ts +++ b/hyperglass/ui/util/common.ts @@ -124,3 +124,23 @@ export function andJoin(values: string[], options?: AndJoinOptions): string { } return last; } + +/** + * Determine if an input value is an FQDN string. + * + * @param value Input value. + */ +export function isFQDN(value: unknown): value is string { + /** + * Don't set the global flag on this. + * @see https://stackoverflow.com/questions/24084926/javascript-regexp-cant-use-twice + * + * TLDR: the test() will pass the first time, but not the second. In React Strict Mode & in a dev + * environment, this will mean isFqdn will be true the first time, then false the second time, + * submitting the FQDN to hyperglass the second time. + */ + const pattern = new RegExp( + /^(?!:\/\/)([a-zA-Z0-9-]+\.)*[a-zA-Z0-9-][a-zA-Z0-9-]+\.[a-zA-Z-]{2,6}?$/im, + ); + return typeof value === 'string' && pattern.test(value); +}