feat(plugin): allowing referer-restriction to dynamically adapt to the BE rules

[wmdmomo]

Please answer these questions before submitting a pull request, or your PR will get closed.

Why submit this pull request?

• Bugfix
• New feature provided
• Improve performance
• Backport patches

What changes will this PR take into?

The PR will change the plugin under plugin/UI (referer-restriction), allowing referer-restriction to dynamically adapt to the back-end json rules.

Related issues

fix/resolve #1588

Checklist:

• Did you explain what problem does this PR solve? Or what new features have been added?
• Have you added corresponding test cases?
• Have you modified the corresponding document?
• Is this PR backward compatible? If it is not backward compatible, please discuss on the mailing list first

[netlify]

✔️ Deploy Preview for apisix-dashboard ready!

🔨 Explore the source changes: d6e64f8

🔍 Inspect the deploy log: https://app.netlify.com/sites/apisix-dashboard/deploys/610fdaa37f45c00008fe6b1a

😎 Browse the preview: https://deploy-preview-2001--apisix-dashboard.netlify.app/

[codecov-commenter]

Codecov Report

Merging #2001 (d6e64f8) into master (5a581d3) will increase coverage by 0.09%.
The diff coverage is 100.00%.

@@            Coverage Diff             @@
##           master    #2001      +/-   ##
==========================================
+ Coverage   65.69%   65.79%   +0.09%     
==========================================
  Files         121      121              
  Lines        3204     3207       +3     
  Branches      778      778              
==========================================
+ Hits         2105     2110       +5     
+ Misses       1099     1097       -2     

Flag	Coverage Δ
frontend-e2e-test	65.79% <100.00%> (+0.09%)	⬆️

Flags with carried forward coverage won't be shown. Click here to find out more.

Impacted Files	Coverage Δ
web/src/components/Plugin/UI/plugin.tsx	83.33% <100.00%> (ø)
...b/src/components/Plugin/UI/referer-restriction.tsx	72.22% <100.00%> (+5.55%)	⬆️
web/src/helpers.tsx	72.13% <0.00%> (+3.27%)	⬆️

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 5a581d3...d6e64f8. Read the comment docs.

[LiteSun]

LGTM

[liuxiran]

Test cases are needed to ensure the feature worked properly

[LiteSun]

Test cases are needed to ensure the feature worked properly

When you have time, could you please help her with the steps of the test? @liuxiran

[liuxiran]

Test cases are needed to ensure the feature worked properly

When you have time, could you please help her with the steps of the test? @liuxiran

Ok, after check the current test case about referer-restriction form, @wmdmomo can try to add test cases to https://github.com/apache/apisix-dashboard/blob/master/web/cypress/integration/route/create-route-with-referer-restriction-form.spec.js,

1. enable referer-restriction plugin, check default white list item should be one, and there is no delete button behind it
2. test the white list input validate rule: input apisix-dashboard_1.com should be passed, and input qq@ should be invalid,
3. default bypass_missing is disabled
4. add a white list item field, each of them should have delete button behind them.

thanks a lot

[liuxiran]

Hi @wmdmomo if you have any problem please let us know, thanks a lot

[wmdmomo]

@liuxiran Sorry to reply now. The referer-restriction test case has been completed.

[bzp2010]

@wmdmomo The code looks good to me. But please pay attention to the errors in CI.

[wmdmomo]

@wmdmomo The code looks good to me. But please pay attention to the errors in CI.

@bzp2010 OK, thanks for your suggestion. The error in CI has been dealt with.

[bzp2010]

LGTM

[bzp2010]

@wmdmomo Thank you very much for your contribution. XD