🎨 add warning for http and not valid slug #2496

sanityv3/schemas/editors/blockContentType.tsx

@@ -6,6 +6,7 @@ import { Flags } from '../../src/lib/datasetHelpers'
 import { ExternalLinkRenderer, SubScriptRenderer, SuperScriptRenderer } from '../components'
 import routes from '../routes'
 import { defaultColors } from '../defaultColors'
+import { strictExternal, warnHttpExternal, warnHttpOrNotValidSlugExternal } from '../validations/validateSlug'
 
 export type BlockContentProps = {
   h2?: boolean
@@ -194,7 +195,12 @@ export const configureBlockContent = (options: BlockContentProps = {}): BlockDef
       {
         name: 'href',
         type: 'url',
-        validation: (Rule: any) => Rule.uri({ scheme: ['http', 'https', 'tel', 'mailto'] }),
+        validation: (Rule: any) =>
+          Rule.uri({ scheme: ['http', 'https', 'tel', 'mailto'] })
+            .custom((value: any, context: ValidationContext) => {
+              return warnHttpOrNotValidSlugExternal(value, context)
+            })
+            .warning(),
       },
     ],
   }

sanityv3/schemas/objects/linkSelector.tsx

@@ -9,6 +9,7 @@ import { AnchorLinkDescription } from './anchorReferenceField'
 // eslint-disable-next-line import/no-unresolved
 import { defaultLanguage } from '../../languages'
 import { apiVersion } from '../../sanity.client'
+import { warnHttpOrNotValidSlugExternal } from '../validations/validateSlug'
 
 export type ReferenceTarget = {
   type: string
@@ -118,7 +119,13 @@ export const getLinkSelectorFields = (labelFieldset?: string, flag?: string) =>
           const { parent } = context as { parent: LinkSelector }
           if (isHidden(parent)) return true
           const connectedField = parent?.linkToOtherLanguage ? parent?.referenceToOtherLanguage : parent?.reference
-          return validateInternalOrExternalUrl(value, connectedField)
+          const internalValidation = validateInternalOrExternalUrl(value, connectedField)
+          //If message from internalValidation return that if not continue to check external url
+          if (internalValidation) {
+            return warnHttpOrNotValidSlugExternal(value, context)
+          } else {
+            return internalValidation
+          }
         }),
       hidden: ({ parent }: { parent: LinkSelector }) => isHidden(parent),
     },

sanityv3/schemas/validations/validateSlug.ts

@@ -41,3 +41,18 @@ export const withSlugValidation = (options: any) => {
       }
     : options
 }
+
+const stringIsSlug = /^[a-z0-9]+(-[a-z0-9]+)*$/
+const httpRegex = /^(?:http:\/\/|).*$/
+export const warnHttpOrNotValidSlugExternal = (slug: string, context: ValidationContext) => {
+  const isHttp = httpRegex.test(slug)
+  const validSlug = stringIsSlug.test(slug)
+  let message = ''
+  if (isHttp) {
+    message = 'Use https in url. '
+  }
+  if (!validSlug) {
+    message = message.concat(`Should only contain lowercase letters [a-z], numbers [0-9], and dashes ("-")`)
+  }
+  return isHttp || !validSlug ? message : true
+}